开发者社区> 问答> 正文

使用line-height的问题?

demo:
css代码
screenshot
screenshot
使用line-height让子类的inline-block元素剧中,但是好像就是差那么一点?
文字不知怎的没有在div2中?

展开
收起
杨冬芳 2016-05-31 11:46:01 2098 0
1 条回答
写回答
取消 提交回答
  • IT从业
    .div1{
      width:100px;
      height:100px;
      background-color:yellow;
      line-height:100px;
      vertical-align:middle;
      font-size:0;
    }
    .div2{
      display:inline-block;
      width:40px;
      height:40px;
      line-height: 40px;
      background:red;
      vertical-align:middle;
      font-size:14px;
    
    }

    inline元素空白符产生的问题,粗暴的解决办法就是父级设置font-size:0,子元素字体大小再恢复设置即可。
    当然,你也可以把div1和div2写在同一行,这样就没问题了。
    至于div2的文字为啥跑走了,因为你行高设置了100px啊,100px啊,被子元素继承了

    2019-07-17 19:21:44
    赞同 展开评论 打赏
问答分类:
问答地址:
问答排行榜
最热
最新

相关电子书

更多
Transforming the data center 立即下载
Top 5 mistakes when wriiting a 立即下载
低代码开发师(初级)实战教程 立即下载