我有三个div并尝试在每个div上画一个边框.但是它只显示了div的顶部边界,正如你在这里看到的那样.
这是我的代码:
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.mydiv
{
position: relative;
border:1px solid yellow;
}
.mydiv_content
{
position: absolute;
border:1px solid red;
}
.mydiv_buttons
{
position: absolute;
border:1px solid green; /* D8D8D8 */
}
</style>
</head>
<body>
<div class="mydiv">
<div class="mydiv_content">
<p> TEST 1</p>
</div>
<div class="mydiv_buttons">
<br>
<input type="submit" value="send"></input>
</div>
</div>
</body>
</html>
我不知道为什么它只显示顶部的边界,如果有人可以向我解释这将是很好的.你可以在jsfiddle上找到完整的代码.
这是因为你设置height与%相对于父div是position:absolute,没有height定义的,因为你正在使用它height:800%;,因为那没有影响position性能.
只需在以下位置定义height父级px:
.mydiv
{
position: relative;
border:1px solid yellow; /* D8D8D8 */
width:70%;
height:800px; // define the height
margin-top: 100px;
margin-left: 200px;
}