html - ie6 ul list display inline-block expend to full width bug -


working on project these days, run weird problem under ie6, (ie7 , other ok)

li element under ul using display:inline-block expend full width. can check img uploaded below.

i using zoom:1 *display:inline trigger display:inline-block lte ie8, works fine under ie7, ie6 has problem above.

here code

            <div class="mp-pagnation">             <ul class="mp-pagnation-list clearfix">                 <li><a href="">&lt;</a></li>                 <li><a href="">1</a></li>                 <li><a href="">2</a></li>                 <li><a href="">3</a></li>                 <li><a href="">4</a></li>                 <li><a href="">5</a></li>                 <li><a href="">...</a></li>                 <li><a href="">654</a></li>                 <li><a href="">&gt;</a></li>             </ul>         </div>      .mp-pagnation{     width:300px;     height:28px;     background:#fff;     margin:0 auto;      *margin-top:20px;     padding:4px 0 0 0;     text-align: center; }  .mp-pagnation-list{     height:24px; } .mp-pagnation-list li{     display:inline-block;     *display:inline;     zoom:1; }  .mp-pagnation-list li a{     display: block;     height:24px;     padding:0px 4px;     text-decoration: none;     color:#00baff;     margin:0px 5px;     font-size:16px; } .mp-pagnation-list li a:hover,.mp-pagnation li a.current{     color:#fff;     background:#00baff; } 

the snapshot of bug: bugs under ie6

only supported in ie6 , ie7 on elements display of inline default.

try: li{*display:inline;*zoom:1;}

bonus url: http://blog.mozilla.org/webdev/2009/02/20/cross-browser-inline-block/


Comments

Popular posts from this blog

javascript - DIV "hiding" when changing dropdown value -

Does Firefox offer AppleScript support to get URL of windows? -

android - How to install packaged app on Firefox for mobile? -