Well, some odd development. Things now work in IE. Not sure why. But anyway, the CSS is all messed up.

I guess I will have to mess with things to get things working in IE.

It's been frustrating.

hi hradek.. i see that u ve joined in '05 and yet have only 4 posts, so yer not much of a bugger like me , are ya (:

anyway, i cant notice anything broken in your site, could you please point to it on a screenshot, i may be able to help you out..
and for particular ie issues, if you can not find a global fix to it, apply another css with a conditional ie css in order not to break things on the other side while you fix/emulate ie things.. cheers

Hello!

Thanks for the reply. I suppose I don't post much anywhere. :D

Here is how the page should look (taken from FireFox v 3.x):
http://www.fieldmarshallhradek.com/images/b2evo_forums/fmh_css_ex_ff_01.jpg

Here is how it looks like in IE which is incorrect:
http://www.fieldmarshallhradek.com/images/b2evo_forums/fmh_css_ex_ie_01.jpg

To give you an idea of what I was seeing before (and when I position the menu absolutely):
http://www.fieldmarshallhradek.com/images/b2evo_forums/fmh_css_ex_ie_02.jpg

To achieve this I change the position from relative to absolute in the CSS, which fixes the menu in IE but then hides the entire block:

ul.fmhNav{
	display: table;
	width: 685px;
	table-layout: fixed;
        margin-top: 100px;
        position: relative;
}

This is an excerpt from the CSS for the entire menu:

/*** fmhNav bar styles ***/

ul.fmhNav,
.fmhNav ul{
/*Remove all spacings from the list items*/
	margin: 0;
	padding: 0;
	cursor: default;
	list-style-type: none;
	display: inline;
}

ul.fmhNav{
	display: table;
	width: 685px;
	table-layout: fixed;
        margin-top: 100px;
        position: relative;
}
ul.fmhNav>li{
	display: table-cell;
	position: relative;
	padding: 2px 6px;
}


ul.fmhNav>li:hover{
	padding-right: 1px;
}

ul.fmhNav li>ul{
/*Make the sub list items invisible*/
	display: none;
	position: absolute;
	max-width: 40ex;
	margin-left: -6px;
	margin-top: 2px;
}

ul.fmhNav li:hover>ul{
/*When hovered, make them appear*/
	display : block;
}

.fmhNav ul li a{
/*Make the hyperlinks as a block element, sort of a hover effect*/
	display: block;
	padding: 2px 10px;
}

/*** Menu colors (customizable) ***/

ul.fmhNav,
.fmhNav ul,
.fmhNav ul li a{
	background-color: #fff;
	color: #3a3a3a;
}


ul.fmhNav li:hover,
.fmhNav ul li a:hover{
	background-color: #E2E2DA;
	color: #3a3a3a;
}

ul.fmhNav li:active,
.fmhNav ul li a:active{
	background-color: #036;
	color: #3a3a3a;
}

ul.fmhNav,
.fmhNav ul{
	border: 1px solid #3a3a3a;
}

.fmhNav a{
	text-decoration: none;
        color: #3a3a3a;
        font-weight: bold;
        border-bottom: 0px;
}

.mainFmhTable {
        margin-top: 25px;
        margin-bottom: 100%;
}

.mainFmhTable h1 {
        color: #656551;
        margin-left: 10px;
}

.fmhSectionLine {
	background: url('img/a22.gif') bottom repeat-x;
	padding: 0 0 10px 10px;
	margin-bottom: 20px;
	position: relative;
}

.lastModifiedFmh {
        color: #3a3a3a;
        font-size: 70%;
}

And while we are talking about the main CSS, the only thing I did was I wanted the skin's main menu it generated to go away and I created my own in its place. To do this:

.top_menu
{
	display: none;
	position: relative;
	background: #46461F url('img/a16.gif') repeat-x;
	height: 67px;
	padding: 0 20px 0 5px;
	margin: 98px 0 20px 0;
	font-family:Tahoma, Georgia, Arial, Verdana, Serif;
	text-transform:uppercase;
}

All I did is enter the display: none; line. Of course, the original breakage happened whether I did this or just delete the entire div containing the top_menu.

display: table-cell does not work in IE. you'll want to play with float instead.

Yes! That was it! A few more tweaks and I should have it.

Thank you,

~FMH