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

解决inline-block上下不对齐

时间:2016-06-24 12:16:57      阅读:171      评论:0      收藏:0      [点我收藏+]

标签:

一开始都是行内元素,但是左边按钮和右边标题就是对不齐,于是,设置左边按钮float:left就可以了。

 <header class="right-header">
    <a href="#" class="tabCourse active">
        <span class="icon-png icon-prev"></span>
    </a> 
    <a href="#" class="tabCourse">
        <span class="icon-png icon-next"></span>
    </a> 
    <a href="#" class="refresh active">
        <span class="icon-png icon-myrefresh"></span>
    </a> 
    <span class="title">
                快乐成长的小太阳 
    </span>
</header>        
.right-header>a {
    float: left;
    display: inline-block;
    padding: 23px 20px;
}

.title {
    display: inline-block;
    border-left: 1px solid #CADFEA;
    font-size: 24px;
    color: #5E97B3;
    padding: 17px;
}

 

技术分享

 

解决inline-block上下不对齐

标签:

原文地址:http://www.cnblogs.com/zhangwei595806165/p/5613724.html

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