css - 无法成功应用css

Question

body{
    background:#eff3f6;
  border: 1px solid #C3D4DB;
}
.content{margin-top:1px;
margin-right:200px;
margin-left:200px;
background:#fefefe;}
.box
{
    background:#fefefe;
    border: 1px solid #C3D4DB;
    border-top:1px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
    -moz-box-shadow:rgba(0,0,0,0.15) 0 0 1px;
    -webkit-box-shadow:rgba(0,0,0,0.15) 0 0 1px;
    box-shadow:rgba(0,0,0,0.15) 0 0 1px;
    color:#444;
    font:normal 12px/14px Arial, Helvetica, Sans-serif;
    margin:0 auto 30px ;
    overflow:hidden;
}

我将内容选择器应用于父<div>类，将框选择器应用于子<div>类。现在它正确应用了。但是每当内容超过一定数量时，整个身体内容就会消失。那么我需要照顾哪些财产？

Answer 1

您可以像下面的示例一样删除overflow: hidden或添加height: auto以扩展 .box div 以覆盖其所有内容。

.box {
    background:#fefefe;
    border: 1px solid #C3D4DB;
    border-top:1px;
    -webkit-border-radius:5px;
       -moz-border-radius:5px;
            border-radius:5px;
    -webkit-box-shadow:rgba(0,0,0,0.15) 0 0 1px;
       -moz-box-shadow:rgba(0,0,0,0.15) 0 0 1px;
            box-shadow:rgba(0,0,0,0.15) 0 0 1px;
    color:#444;
    font:normal 12px/14px Arial, Helvetica, Sans-serif;
    margin:0 auto 30px ;
    overflow:hidden;
    height: auto; /* This will expand the height of the container to contain all of its contents */
    }