简体   繁体   English

css中高度的条件语句

[英]Conditional statement for height in css

I want a div to be a specific height until its content needs more space. 我希望div成为特定高度,直到其内容需要更多空间。

let me explain further: 让我进一步解释一下:

<html>
<section>
<div id="container">
<?php while($row =mysql_fetch_array($result)){
echo '<h2>'.$row["title"].'</h2>';
echo $row["body"];
echo $row["user"];}
</div>
</section>
</html>

Now I want the DIV with ID container to have an height of 200px even if it's empty but as more contents are being populated to it, it should now be responsive and increase in size, I don't want to use height:100px because thats still now what I want. 现在我希望ID容器的DIV高度为200px,即使它是空的,但随着更多内容被填充到它,它现在应该响应并增加大小,我不想使用高度:100px因为那样现在仍然是我想要的。

This is what you want : 这就是你想要的:

min-height:100px;

It will be 100px high by default, even if there's no content, and will expand if needed. 默认情况下它会高出100px,即使没有内容,如果需要也会扩展。

JSFiddle Demo JSFiddle演示

Example CSS 示例CSS

.min { min-height:100px; width:100px; background:#ccc; margin:10px; }

Example HTML 示例HTML

<div class="min"></div>
<div class="min">
    <p>Lorem ipsum dolor sit amet,</p>
    <p>Lorem ipsum dolor sit amet,</p>
    <p>Lorem ipsum dolor sit amet,</p>
    <p>Lorem ipsum dolor sit amet,</p>
    <p>Lorem ipsum dolor sit amet,</p>
    <p>Lorem ipsum dolor sit amet,</p>
    <p>Lorem ipsum dolor sit amet,</p>
    <p>Lorem ipsum dolor sit amet,</p>
    <p>Lorem ipsum dolor sit amet,</p>
</div>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM