[thelist] My css rollover drop-downs are not working on ie

martin at fiercestreetnetworks.aboho.com martin at fiercestreetnetworks.aboho.com
Thu Apr 8 14:48:16 CDT 2004


Hello List,

My css rollover drop-downs are not working on ie for my breadcrumbs.
Strange, but I'm using the same technique for my right-side
navigation, and they do work. Below code is the browser
list that the rollovers work/don't work in.

I worked up a test page:
http://fiercestreetnetworks.aboho.com/css-rollover-test.html

XHTML:
=============
<div id="breadcrumbs">
 <ul>
  <li><a href="/">home
   <span>back to main page</span>
   </a>
  </li>
  <li>&gt;&gt;<a href="it.html">tech support
   <span>all i.t. services I offer</span>
   </a>
  </li>
  <li>&gt;&gt;<a href="sales.html">portfolio
   <span>choose a site template from my portfolio, and i'll create one just
for you!</span>
   </a>
  </li>
  <li>&gt;&gt;<a href="weblog/">blog
   <span>site blog. almost updated daily</span>
   </a>
  </li>
 </ul>
</div>

CSS:
==============
#breadcrumbs {
 font-size: .85em;
 text-align: left;
 margin: 0 0 20px 140px;
/* margin-right: 34%; */
 background: #7a9079;
 color: #647663;
 border: 1px outset #647663;
 }
#breadcrumbs ul {
 margin: 0;
 padding: 0;
 list-style: none;
 }
#breadcrumbs ul li {
 display: inline;
 }
#breadcrumbs ul li a {
 background: transparent;
 color: #cdcdb3;
 padding: 0 .5em;
 position: relative;
 }
#breadcrumbs ul li a span {
 display: none;
 }
#breadcrumbs ul li a:hover span {
 display: block;
 position: absolute;
 top: 1.5em;
 left: 5px;
 width: 200px;
 padding: 3px;
 background: #7a9079;
 color: #cdcdb3;
 border-top: 2px solid #cdcdb3;
 border-right: 2px solid #000;
 border-bottom: 2px solid #000;
 border-left: 2px solid #cdcdb3;
 z-index: 300;
 }
================================
Browsers:

Netscape
1.    6.1, 7.0, 71 = Working

Mozilla
1.    1.5, 1.6b, 1.7b = Working
2.    Firebird, Firefox = Working

Opera
1.    6.05 = Not working
2.    7.01 = Working, but drop-down in wrong position
3.    7.1, 7.23, 7.5 = Working

IE
1.    5.01, 5.5 = Not working
2.    6 = Works every (I kid you not!) 20 times - very randomly displayed.

Anyone have thoughts?

Best Regards,

Martin Espericueta
/Information Technology Administrator
/Web Designer
/Webmaster
San Francisco Bay Area & Central Valley
"Web Designs with Standards!"
(Email) martin @ fiercestreetnetworks.aboho.com
(Web) http://fiercestreetnetworks.aboho.com/
(Lists) http://www.css-discuss.org/about.html
(Lists) http://four.pairlist.net/mailman/listinfo/css-foundations



More information about the thelist mailing list