Ie7 float problems and hiperlinks problems
- by Uffo
Markup
<ul class="navigation clearfix">
<li class="navigation-top"></li>
<div class="first-holder" style="height:153px;">
<dl class="hold-items clearfix">
<dd class="clearfix with"><a href="http://site.com" title="Protokoll">Protokoll</a></dd>
<dd class="with-hover"><a href="http://site.com" title="Mein/e Unternehmen">Mein/e Unternehmen</a></dd>
<dd class="with"><a class="face-me" href="http://site.com" title="Erweiterte Suche">Erweiterte Suche</a></dd>
<dd class="with"><a href="http://site.com" title="Abmelden">Abmelden</a></dd>
</dl>
</div><!--[end] /.first-holder-->
<li class="navigation-bottom"></li>
</ul><!--[end] /.navigation-->
Css:
.first-holder{height:304px;position:relative;width:178px;overflow:hidden;margin-bottom:0px;padding-bottom: 0px;}
.hold-items{top:0px;position:absolute;}
.navigation dd.with{line-height:38px;background:url('/images/sprite.png') no-repeat -334px -46px;width:162px;height:38px;padding-bottom:0px;overflow: hidden;}
.navigation dd.with a{position:relative;outline:0;display:block;font-weight:bold;color:#3f78c0;padding-left:10px;line-height:38px;}
.with-hover{background:url('/images/sprite.png') no-repeat -505px -47px;width:178px;height:38px;line-height:38px;overflow:none;}
.with-hover a{position:relative;display:block;font-weight:bold;color:#fff;padding-left:10px}
.navigation-top{background:url('/images/sprite.png') no-repeat -694px -46px;width:160px;height:36px;}
.navigation-top a{display:block;outline:0;height:20px;padding-top:18px;padding-left:138px;}
.navigation-top a span{display:block;background:url('/images/sprite.png') no-repeat -212px -65px;width:8px;height:6px;}
.navigation-bottom{background:url('/images/sprite.png') no-repeat -784px -402px;width:160px;height:37px;}
.navigation-bottom a{display:block;outline:0;height:20px;padding-top:18px;padding-left:138px;}
.navigation-bottom a span{display:block;background:url('/images/sprite.png') no-repeat -212px -74px;width:8px;height:6px;}
Also the links, are not clickable, if I click on a link in IE7 it doesn't do the action..it doesn't redirect me to the location.
This is how it looks in IE7:
http://screencast.com/t/MGY4NjljZjc
This is how it look in IE8,Firefox,Chrome and so on
http://screencast.com/t/MzhhMDQ1M
What I'm doing wrong
PS: .navigation-top a span and .navigation-bottom a span I'm using some where else, but that it's ok it works fine.