Transparent li and ul tags — menu issues

[tannercampbell]

Hey all,

http://3rconcepts.com/test if you load this in IE9 you’ll notice that the menu system … for some crazy reason … manifests with a white background. Any thoughts on this? I’ve attempted applying background-color: none; as well as background: none; to the various li and ul classes in the css … no luck. What’s going on here?

[TheDoc]

It is also happening in IE8, and presumably all versions of IE.

It looks like it’s being applied to the li for sure. But why… Could be this:

ul.MenuBarHorizontal

{

margin-top: 0px;

margin-left: 3px;

padding: 12px 0 0 0;

list-style-type: none;

font-size: 22px;

font-family: Calibri, Arial, Helvetica, sans-serif;

cursor: default;

width: 100%px; /* COULD BE THIS */

background-color: none;

}

[TheDoc]

I would also run your site through a validator – both the HTML and CSS have errors.

[TheDoc]

“width: 100%px;” is not a valid width. IE could be thrown by the fact that it is an error.

You can only declare % or px, not both.

[TheDoc]

I think this is it:

ul.MenuBarHorizontal li.MenuBarItemIE

{

display: inline;

float: left;

background: #FFF;

}

[TheDoc]

No problemo!

[Author]

Posts