码迷,mamicode.com
首页 > 其他好文 > 详细

bug:inline-block间距bug的调整

时间:2014-08-18 16:15:22      阅读:256      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   color   使用   ar   2014   div   

bubuko.com,布布扣

<div id="one">
        <a href="">首页</a>
        <a href="">首页</a>
        <a href="">首页</a>
        <a href="">首页</a>
        <a href="">首页</a>
</div>
*{
            margin:0;
            padding:0;
        }
        div a{
            display: inline-block;
            text-align: center;
            width:70px;
            background-color: #A9A9A9;
        }
        #one a:link{
            color:white;
        }
        a:hover{
            background-color: red;
            color:green;
        }

 

方法一:使用word-spacing或者letter-spacing 

#one{
            word-spacing: -10px;
        }
#one a{
            word-spacing:0px;
        }

方法二:使用margin的负值

#one a{
            margin-rignt:-10px;
        }

更多内容请看:

  http://www.zhangxinxu.com/wordpress/2012/04/inline-block-space-remove-%E5%8E%BB%E9%99%A4%E9%97%B4%E8%B7%9D/

以及:

  http://www.zhangxinxu.com/wordpress/2010/11/%E6%8B%9C%E6%8B%9C%E4%BA%86%E6%B5%AE%E5%8A%A8%E5%B8%83%E5%B1%80-%E5%9F%BA%E4%BA%8Edisplayinline-block%E7%9A%84%E5%88%97%E8%A1%A8%E5%B8%83%E5%B1%80/

bug:inline-block间距bug的调整,布布扣,bubuko.com

bug:inline-block间距bug的调整

标签:style   blog   http   color   使用   ar   2014   div   

原文地址:http://www.cnblogs.com/bjchenxn/p/3919630.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!