我想将div高度扩展100%,但它不起作用:

到目前为止,我的代码是:
.add{
border:1px solid #ddd;
display:block;
float:right;
margin:0 0 10px 10px;
padding:10px;
height:100%;
}
Run Code Online (Sandbox Code Playgroud)
和HTML:
<div>
<div class="add">
<div style="width:100px;height:400px;background:#ccc;"></div>
</div>
Lorem ipsum dolor sit amet... And a lot of text here
Lorem ipsum dolor sit amet... And a lot of text here
Lorem ipsum dolor sit amet... And a lot of text here
</div>
Run Code Online (Sandbox Code Playgroud)
你应该指定外部div的高度.这样的东西会起作用:
<!doctype html>
<html>
<head>
<style>
.add
{
border:1px solid #ddd;
display:block;
float:right;
margin:0 0 10px 10px;
padding:10px;
height:100%;
}
</style>
</head>
<body>
<div style="height: 768px;">
<div class="add">
<div style="width:100px;height:400px;background:#ccc;"></div>
</div>
Lorem ipsum dolor sit amet... And a lot of text here
Lorem ipsum dolor sit amet... And a lot of text here
Lorem ipsum dolor sit amet... And a lot of text here
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)