IE 5.0 Win severe styled list quirk

All right, I have no idea what's happening or why, but please visit my no-ip account (<!-- m --><a class="postlink" href="http://projep.no-ip.com:81/">http://projep.no-ip.com:81/</a><!-- m -->) and mouse over the sidebar navigation in IE 5.0 Win. There are no problems in IE 6.0 and 5.5, but the browser crashes in 5.0 when mousing over this sidebar, and does not display properly, every time. Does anyone know why? I'm at a loss.

Thanks in advance.I'll be leaving my computer on for the rest of the day (or I plan to, anyways), so if you'll be able to access the page.what happens if you add dimensions to #links li a (other than it screwing the box model)Remove a.jump {display: none;} It will stop 'jumping' :DOriginally posted by DaveSW
what happens if you add dimensions to #links li a (other than it screwing the box model) Yeah, that worked. I just added height: auto !important; height: 1em;, and that seems to be working very well.
Originally posted by Fang
Remove a.jump {display: none;} It will stop 'jumping' :D Ah, well that did fix the jumping, but I still needed to hide the jump links, so I replaced it with html>body a.jump {display: none;} and * html a.jump {visibility: hidden; font-size: 0.01em;}. However, this isn't the best fix possible... is there any way I can hide the jump link and not screw with IE5?

Much thanks. :D By the way, for anyone with the same problem reading this - it's a combination of the two fixes that resolves the issue.You can remove float:right from #header to prevent the 'jumping'.
In fact changing several properties does the same. Your css and html is confusing IE5.
Possible problems:
using the value 'header' for id, class and name (still to be added)
using tag names for id and/or class - body and img
there are 5 rule for #header when 2 would be enough
divitis -
<div id="header" title="Personified">
<h1><a href=http://www.webdeveloper.com/forum/archive/index.php/"http://projep.no-ip.com:81/"><span>Personified</span></a></h1>
</div>

h1 is all you need
<h1 id="header" title="Personified"><a href=http://www.webdeveloper.com/forum/archive/index.php/"http://projep.no-ip.com:81/">Personified</a></h1>

Clearing up these issues may not solve the problem, but it would make for cleaner code.Actually, the reason it's like that is the previous style, which I plan to add as an alternate stylesheet. The img class is just so I can style the image and group it with it's caption (only one instance so far, but I plan for more).IE5.0 is weird like that. Congratulations anyway.Uhm, okay... but what am I going to do about the jump links, if I can't hide them with display: none? Is there a hack that specifically targets IE5?

EDIT : A little sloppy, but it gets the job done well enough.
a.jump {display: block; font-size: 0.01em; line-height: 1px; visibility: hidden;}
i{content:"\"/*"}
a.jump {display: none;} Searchers : <http://www.centricle.com/ref/css/filters/tests/inline_highpass/>oh sorry I thought you'd resolved it. Usual technique is to push it off the left of the screen. See <!-- m --><a class="postlink" href="http://www.sitepoint.com/forums/showthread.php?t=139261">http://www.sitepoint.com/forums/showthread.php?t=139261</a><!-- m -->

edit: seriously good article here; <!-- m --><a class="postlink" href="http://www.jimthatcher.com/skipnav.htmOriginally">http://www.jimthatcher.com/skipnav.htmOriginally</a><!-- m --> posted by DaveSW
oh sorry I thought you'd resolved it. Usual technique is to push it off the left of the screen. See <!-- m --><a class="postlink" href="http://www.sitepoint.com/forums/showthread.php?t=139261">http://www.sitepoint.com/forums/showthread.php?t=139261</a><!-- m -->

edit: seriously good article here; <!-- m --><a class="postlink" href="http://www.jimthatcher.com/skipnav.htm">http://www.jimthatcher.com/skipnav.htm</a><!-- m --> Ah, thank you. I'll be looking into those right now. Sorry for being snappy, btw... sleep deprived. ;)

EDIT : Good stuff. I don't know why I didn't think of positioning it in the middle of nowhere, but, oh well. a.jump {position: absolute; left: -1000em; width: 20em;} (For teh searchers). Thanks again.
 
Back
Top