Hi, I'm trying to style a horizontal menu with double borders on the active LI menu item. There is some use of nested floating, as I want to use blocks for the LI to get them an even width. IE (7, haven't even tried 6) just gets it plain wrong (from my point of view). The double border seems to work differently in IE compared to all other browsers I've tried (FF, Opera, Chrome). IE renders the "middle" line in a double border transparent. All other browsers use the elements bg-color. IE also shows som strange stuff with the alignment. The borders overlap the parent elements borders. Some kind of collapsing borders in IE?!?! Is this really the case or is my CSS/HTML just broken in IE? One huch I have is that IE is using it's own box model, not the standard compliant? I vaguely remember something about IE not including the borders inside the box.
The look I'm after is a "double border" with the inner border the same color as the parent bg, and the outer the element bg. This I get in all sane browsers by specifying the parent bg as the border color and the border style "double". This gives me a separated border with the element bg color. In the example I use red, not the parent backgroundborder color, to see the border clearly. The green border is just for your viewing pleasure. It is a div used for markup to center the menu. If anybody has a cleaner centering-solution, I'd bee happy to look at it. For a test-case see: http://www.ekebodagis.fi/ekebo/test.html Regards, Jon Wickström ______________________________________________________________________ css-discuss [[email protected]] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
