为了账号安全,请及时绑定邮箱和手机立即绑定

在这个代码中为什么添上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>


正在回答

2 回答

0 回复 有任何疑惑可以回复我~

没有overflow的时候wrapper因为里面的元素浮动没有消除,不会占据高度,overflow不仅可以隐藏溢出,还可以消除浮动。

1 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

在这个代码中为什么添上overflow:hidden后wrap就有高度了?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信