Menu
I want a div to be a specific height until its content needs more space.
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.
753
asked Dec 02 '25 23:12
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.
JSFiddle Demo
Example CSS
.min { min-height:100px; width:100px; background:#ccc; margin:10px; }
Example 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>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
