So, I installed IE7b2 and immediately noticed that the top nav tabs at the MDC are very broken. Could someone else with IE7b2 check the site and verify that I’m not the only one seeing the problem? They work OK (not perfect, but OK) in IE6, so I’d like to figure out what the problem is.
Bonus points if you can figure out how to fix it. The (currently sort of ugly) CSS are here.
Thanks!
The problem is the display: block line in the #navigation #contenttypes li a definition in base.css.
Removing that line seems to fix it (playing with a locally saved copy of the page) in IE7b2 without breaking FF 1.5 or IE6. That said, I don’t know what older browser might be using that bit of code and be affected by losing it.
Yup there’s bustage. Not sure if I can help with the fix.
Cool, thanks guys. I’ll test Bill’s proposed fix shortly. :)
Deb, I confirm that there are layout problems of the navigation links when using the latest IE 7 beta 2 build 5346.5.
Note that the javascript console report CSS parsing errors:
#navigation #personal a {
_width: 1%;
}
_width is not a CSS property.
Warning: Unknown property ‘_width’. Declaration dropped.
Source File: http://developer.mozilla.org/css/base.css
Line: 194
Gérard
I think the _xxxxxx aer IEisms. Our Web designer once told me that alot of CSS hacks he uses make use of this “feature”. IE(6) will make use of _xxxx attributes while Firefox ignores them. He can then manage to get pages to behave identically (or close to it) on IE and FF.
BOCICBW (but of course, I could be wrong).
L
I think the _xxxxxx aer IEisms. Our Web designer once told me that alot of CSS hacks he uses make use of this “feature”. IE(6) will make use of _xxxx attributes while Firefox ignores them. He can then manage to get pages to behave identically (or close to it) on IE and FF.
BOCICBW (but of course, I could be wrong).
L
Just don’t use height and line-height for element inside navigation (in common case I usually use vertical padding instead of height + line-height).
But it’s definitely a BUG of IE7b2 that DOESN’T NEED for any workaround and should be reported to Microsoft and fixed by IE programmers before final IE7 ships.
P. S. Removing _width doesn’t change nothing for me. But to make links clickable at its whole area (that probably is the aim of using _width: 1%) I usually use “Star HTML” hack with 1px height for element. That hack now (since IE7 ignore it in strict mode) is a good way to address CSS rules (that are workaroud of bugs that are NOT longer takes place in IE7) separately for IE5-6 and IE7.
[sorry for reposting but some my text was handled as real anchor tags while it's not]
Just don’t use height and line-height for [A] element inside navigation (in common case I usually use vertical padding instead of height + line-height).
But it’s definitely a BUG of IE7b2 that DOESN’T NEED for any workaround and should be reported to Microsoft and fixed by IE programmers before final IE7 ships.
P. S. Removing _width doesn’t change nothing for me. But to make links clickable at its whole area (that probably is the aim of using _width: 1%) I usually use “Star HTML” hack with 1px height for [A] element. That hack now (since IE7 ignore it in strict mode) is a good way to address CSS rules (that are workaroud of bugs that are NOT longer takes place in IE7) separately for IE5-6 and IE7.
IE7 has the same problem with my site’s menu: http://design-noir.de
IE6 had this too. That’s why you added a workaround (_width: 1%). But IE7 won’t recognize _width (which is correct).
#navigation #contenttypes li a { float: left; } would do the trick. But I suggest you leave it as it is and ask Microsoft to fix this ancient CSS1 bug.
Dao: your float:left; fix works. Thanks a million :)
‘Course I still have to test in all the other browsers…
Microsoft’s Markus Mielke says the bug is fixed :)
http://design-noir.de/log/2006/04/internet-explorer-7-beta-2-veroeffentlicht/#comment-20
Cool thanks guys. I’ll test Bill’s proposed fix shortly…
Cool thanks guys. I’ll test Bill’s proposed fix shortly…
Recent Comments