大佬教程收集整理的这篇文章主要介绍了css – 为什么div会以相对/绝对定位崩溃？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
<html>
<head>
<style type="text/css">
body {
BACkground-color:#eee;
}
#content {
margin:0 auto;
position:relative;
border:1px solid red;
width:800px;
display:block;
BACkground-color:white;
}
#header {
border:1px solid black;
BACkground-color:#777;
color:white;
width:800px;
position:absolute;
left:0;
top:0;
}
#leftcol {
position:absolute;
border:1px solid black;
BACkground-color:#ddd;
width:200px;
top:100px;
left:0;
}
#rightcol {
position:absolute;
top:100px;
left:205px;
border:1px solid black;
BACkground-color:#ddd;
width:500px;
}
</style>
<title>CSS Positioning Example 1</title>
</head>
<body>
<div id="content">
<div id="header">
<h1>The Awesome Website</h1>
</div>
<div id="leftcol">
<h2>About</h2>
<p>
This website is so awesome because it was made by someone
and that is really all there is to it. There.
</p>
</div>
<div id="rightcol">
<p>This is where I'm going to put some real body text so that it goes
on and on for a while and so I can get a sense of what happens when
the text in the paragraph keeps going and the box containing it keeps
going on as well.
</p>
</div>
</div>
</body>
</html>
这里发生了什么？为什么红边内容div会崩溃,即使它包含其他div？
以上是大佬教程为你收集整理的css – 为什么div会以相对/绝对定位崩溃？全部内容，希望文章能够帮你解决css – 为什么div会以相对/绝对定位崩溃？所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。