为什么div的位置设置为固定时会调整大小？

Question

这可能听起来微不足道，但我很想知道为什么会发生这种情况。我有以下代码：为什么当

.fixed { 
 
    position : fixed; 
 
    border : 1px solid black; 
 
    padding : 5px; 
 
    right : 0; 
 
    bottom : 0; 
 
}

<div class="fixed"> 
 
I am just a fixed value 
 
</div>

它是一个div宽伸出两端的位置：未指定固定的属性。与指定的位置属性一起缩小为内容的大小。

Answer 1

默认情况下，元素在位置上是静态的。由于div是一个块元素，所以它继承了父元素的宽度，因此它在父元素的极限内被拉伸。

当一个元件被定位，那么它被取出的元件的正常流动的，因此它不能继承任何尺寸从它的父（宽度在这种情况下）。

考虑你的例子，当div没有定位时，它会从它的父项继承宽度，因此它有一些尺寸。当你添加位置：固定为样式时，它被取出正常流程，因此它不能继承任何维度。任何维度都将基于您在css规则中定义的值或其内容占用的默认宽度。

对于position：绝对也是如此。