更改Div高度参数对尺寸没有任何影响

我不明白为什么此容器的height（summaryBox）未更改。我试图设置min-height,max-height和改变一些其他的东西，但没有任何工作。我希望容器的height是屏幕的20％，但它不工作。其他一切正常，我正在挠头。更改Div高度参数对尺寸没有任何影响

CSS：

.summaryBox { 
     border: 1px solid green ; 
     width: 80%; 
     margin: auto; 
     overflow: hidden; 
     min-height: 20%; 
} 

.summaryBox .img1 { 
     width: 21%; 
     float: left; 
     color: white; 
     padding: 0px .5% 0px .5%; 
} 

.summaryBox .img2 { 
     width: 21%; 
     float: left; 
     color: white; 
     padding: 0px .5% 0px .5%; 
} 

.summaryBox .sum1 { 
     width: 21%; 
     float: left; 
     color: white; 
     padding: 0px .5% 0px .5%; 
} 

.summaryBox .sum2 { 
     width: 21%; 
     float: left; 
     color: white; 
     padding: 0px .5% 0px .5%; 
} 

.summaryBox .arrowPanelLeft { 
     float: left; 
     width: 6%; 
     color: white; 
     text-align: center; 
} 

.summaryBox .arrowPanelRight { 
     float: right; 
     width: 6%; 
     color: white; 
     text-align: center; 
}

HTML：

<div class="summaryBox"> 
    <div class="arrowPanelLeft"> 
      <p><</p> 
    </div> 
    <div class="img1"> 
     <p>dasfafgafdgdafgdfsgdsfgdfsgdsfg</p> 
    </div> 
    <div class="sum1"> 
     <p>dasfafgafdgdafgdfsgdsfgdfsgdsfg</p> 
    </div> 
    <div class="img2"> 
     <p>dasfafgafdgdafgdfsgdsfgdfsgdsfg</p> 
    </div> 
    <div class="sum2"> 
     <p>dasfafgafdgdafgdfsgdsfgdfsgdsfg</p> 
    </div> 
    <div class="arrowPanelRight"> 
      <p>></p> 
    </div> 
</div>

来源

2015-10-23 samuelk71

您还需要设置html和body元素的高度。这是'CSS重置'（比如Eric Meyer's）通常会为你做的事情。将此代码附加到您的css文件：

html, body { 
    height: 100%; 
    width: 100%; 
    padding: 0; 
    margin: 0; 
}

来源

2015-10-23 18:51:50

您已设置.summeryBox高度的百分比是什么..？你需要把它添加到你的CSS：

html, body { 
    height: 100%; 
    width: 100%; 
    padding: 0; 
    margin: 0; 
    }

然后.summeryBox将相对于身体标记进行设置。

或者，您可以设置外部容器（.summeryBox）尺寸（以像素为单位）。

来源

2015-10-23 18:51:20 Vingtoft

工作感谢你，但你怎么不需要设置身体的宽度以及？ – samuelk71

您应该这样做，否则元素的宽度将换行到内容。查看编辑。 – Vingtoft

好的，非常感谢。 – samuelk71

更改Div高度参数对尺寸没有任何影响

回答

相关问题