lee*_*e23 15 css position absolute width
我是css的新手.我想知道为什么当我将div元素的位置更改为绝对时,div元素的宽度会发生变化？在Chrome v25.0.1364.172m和IE9中尝试过,两者都有相同的结果.
简单的例子:
<!doctype html/>
<html>
<head>
<title>test</title>
<style>
div {
position:relative;
border-width: 1px;
border-style: solid;
border-color: black;
}
</style>
</head>
<body>
<div>test</div>
</body>
</html>
SMa*_*yen 25
因为绝对定位的元素不像块级元素那样表现,并且不像正常的
<div>那样在彼此之后流动.
您需要为绝对定位的div设置宽度和高度,具体取决于它包含的内容.
绝对定位的元素将相对于它所在的第一个父元素定位.所以,一个简单的例子:
一个简单的'gotcha'没有设置父元素 position: relative;
<!-- I'm a parent element -->
<div style="width: 500px; height: 500px; position: relative; border: 1px solid blue;">
<!-- I'm a child of the above parent element -->
<div style="width: 150px; height: 150px; position: absolute; left: 10px; top: 10px; border: 1px solid red;">
I'm positioned absolutely to my parent.
</div>
</div>