Hi, I have a client that wants a menu that flys out to another cell in a table. I know this can be done with a remote rollover. The problem is that when the menu flys out into the other cell there are two links that will be available there (see screenshot).I cannot figure it out. Any ideas would be appreciated.
Vertical rollovers are pretty easy to do. It’s not quite clear what you want, though. Something like this?
The menu must span two table cells.
That’s not very clear. Firstly, forget table cells, as they have no business here. Do you mean a vertical version of this, where there multiple levels of submenus?
It is a redesign of a site with tables. The client wants the navigation in the left cell and have the menu appear in the right cell (as per the screenshot) It is not a basic flyout menu. Those are a breeze. I have included another screenshot with more explanation.
Hi, Where would I go to alter the position from the top. I want to move the menu up slightly. Does that make sense? Thanks.
Assuming that the menu is written with a list, and assuming that vertical margins have not been zeroed, you can do this:
ul {margin:0}
Another guess would be to reduce any vertical padding in the td’s.
A link to the site would be most helpful so we could see the actual code at work.
Hey @sausydog;
We’re running a test of our live CSS problem solving product today.
If you want to utilise our experts to get your site sorted out immediately, you can check it out here http://codefix.sitepoint.com/
Your client is wrong ( sometimes you have to explain that to them) , semantically you should use tables for anything else BUT tabular data. and a menu is NOT tabular.
Also, a drop down menu is semantically a nested list, which conveniently allows for what you are trying to do since the sub menu are contained in the parent elements.
anyway, assuming your client is stubborn and insist on laying out his/her site with tables I would… CHEAT 
- code the menu in the form of a list and place it in ONE TD, leave the other one ‘blank’
- wrap the menu in a div ( because TDs wont take position :relative
) , and give the DIV position relative the same dimensions as the cell. - AP the UL ULs to appear to left:100%; and with the same height and width as the parent DIV
- tweak as need be.
BONUS: This is possibly even more robust than if what you were asking for were actually possible because if your content extends past the container it can overflow w/o breaking the whole layout. If this were possible to code with tables ( let’s assume through the ‘magic’ of .js) if your content ever extended past the originally planed dimension the TDs would stretch and thus break the layout. Really tables for this= bad.
hope that helps