Hey lads/ladies,

Just working on a site at the moment, and have hit abit of a hurdle.

The site was made in PS, then sliced up and exported out as html and then worked on in Dreamweaver, all good so far.
Now I have put in an expanding/contracting menu/list thingy from dynamicdrive.

The problem im having is that when you expand the menu/list the tables around it which contain all the other buttons/tabs..etc.. expand as well, so the main menu buttons move apart. However this only happens in IE and FF, and works how I want it to in Opera 10.

See screenshots for whats happening. (mind the crazy colors)

Opera 10
You will notice that nothing changes other than the PINK table cells with the X's expand down to allow for the larger table with the expanding menu. Thats just how I want it to work. Those pink cells wont have any images in them so they can change size... suits me.
menu closed
menu opened

Internet Explorer 8 (and similar result in FF 3.5,)
When you open the expand the menu all cells expand evenly to incorporate the now larger middle cell with the menu/text in it.
Not what I want. as the colored cells have images/buttons in them and when they all resize nothing lines up anymore.
menu closed
menu opened

You can view the test page HERE
And download the necessary files HERE

Is there anyway I can replicate the behaviour in Opera10 in both IE and FF? have I fudged something up somewhere? (most likely)

The colors are just to make the cells stand out more, and they are filled with spacer.gif set to be the same size as the original content which I have removed just for testing.

What I have tried:
Locking in the px dimensions of each cell that I don't want to change heights.. no difference.
Tried a few CSS bits and bobs to make the cells stay put.. also.. no dice.
I even tried using Dreamweavers built in table -> div converter which converted everything fine, but then the content just spilled out over the divs with the menu was open.

Many thanks for any and all help :cool:

Ahh, never mind, nested a table with all the menu items within one of the existing tables cells, so the cell can expand but the menu buttons don't expand (cause they are in their own table) which was causing the gaps.
Solved.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.