Ie7 float problems and hiperlinks problems

Posted by Uffo on Stack Overflow See other posts from Stack Overflow or by Uffo
Published on 2010-06-14T22:51:05Z Indexed on 2010/06/14 22:52 UTC
Read the original article Hit count: 320

Filed under:
|
|
|

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.

© Stack Overflow or respective owner

Related posts about html

Related posts about css