在这个代码中为什么添上overflow:hidden后wrap就有高度了?
11-8这一张的代码.因为取消掉它就没有了自带的green背景了
代码如下:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>columns</title>
<link href="style.css" rel="stylesheet" type="text/css">
<style>
.wrapper{
width: 100%;
background: green;
max-width: 980px;
/*overflow: hidden;*/
margin-left: auto;
margin-right: auto;
border:5px solid red;
}
.left {
float: left;
width: 20%;
background: orange;
min-height: 100px;
}
.content {
float: right;
width: 78%;
background: blue;
min-height: 100px;
}
@media (max-width: 480px) {
.wrapper {
min-width: 320px;
width: 98%;
margin-left: 1%;
margin-right: 1%;
}
.left {
float: none;
width: 100%;
}
.content{
float: none;
width: 100%;
}
}
</style>
</head>
<body>
<div class="wrapper">
<div class="left"></div>
<div class="content"></div>
</div>
</body>
</html>