首頁  >  問答  >  主體

div设置浮动之后整个div向下移动了一些。为什么?

#test1{
    height: 80px;
    width: 80px;
    background-color: black;
    color:white;
 
    padding:5px; 
     
    border:10px solid;
    border-top-color: red;
    border-right-color: green;
    border-bottom-color: blue;
    border-left-color: yellow;    
 
    margin:10px;
 
    line-height: 80px;
    text-align: center;
    /* float: left; */

这个div我添加了float:left之后,感觉整个位置向下移动了一点距离。

这是啥这是啥2790 天前1776

全部回覆(2)我來回復

  • 数据分析师

    数据分析师2017-10-01 01:06:24

    div設定浮動之後整個div向下移動了一些。為什麼? -PHP中文網問答-div設定浮動之後整個div向下移動了一些。為什麼? -PHP中文網問答

    圍觀一下哦,學習一下。

    回覆
    0
  • 怪我咯

    怪我咯2017-03-23 17:56:20

    这个问题主要的原因是你没有对body进行重置。chrom body元素默认情况下有margin为8px。而你设置了一个margin: 10px;在正常流中,margin会重叠。10px > 8px,所以取大的10px;但是当你对div添加了浮动之后,margin的算法就会变为叠加,因为float: left;会让div脱离当前的流。所以上面的margin变为18px;你就感觉div下降了。现在处理的办法是,你设置一个body{padding: 0; margin: 0;} 这样你添不添加floatdiv都不会动,你可以试试。

    回覆
    0
  • 取消回覆