美文网首页
img父盒子未设置宽度,浮动后不占宽度

img父盒子未设置宽度,浮动后不占宽度

作者: liujunyan | 来源:发表于2016-09-05 17:52 被阅读0次

    对以下结构:

    <div class="fl">
      <img src="https://img.haomeiwen.com/i1487291/3ed84327037e3d2a.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/480/q/100" alt="">
    </div>
    <div class="nor">123</div>
    

    设置样式:

    .fl {
      float: left;
      height: 20px;
      width: 10px;
      padding: 10px 10px;
      margin: 10px 10px;
    }
    

    其中,fl的div未设置宽度,此时会发现nor的div的宽度占满一行,就像fl的div不占有宽度一样,即使其已经设置了内、外边距,横向边距也不会影响到第二个div占满一行。
    但是只要给第一个div手动设置了width,其宽度和边距就会生效,并影响到第二个div的显示。

    相关文章

      网友评论

          本文标题:img父盒子未设置宽度,浮动后不占宽度

          本文链接:https://www.haomeiwen.com/subject/goirettx.html