Try adding overflow: hidden
to the container div. This will then allow it to wrap the containing div
's
.redBG {
background: red;
overflow: hidden;
}
Pergunta
I am trying to create a row using Zurb Foundation on my site. For this row, I would like the background color to be red. For some reason, the background-color is only being applied to the h3 element inside the row. How can I make it so that the background color is applied to the whole row?
HTML:
<div class="redBG">
<h3>NUMBERS</h3>
<div class="large-4 columns"><a title="1" href="#"><img src="http://blognumbers.files.wordpress.com/2010/09/1.jpg" alt="1"></a></div>
<div class="large-4 columns"><a title="2" href="#"><img src="http://blognumbers.files.wordpress.com/2010/09/2.jpg" alt="2"></a></div>
<div class="large-4 columns"></div>
</div>
CSS:
.redBG {
background:red;
}
Thanks!
Solução
Try adding overflow: hidden
to the container div. This will then allow it to wrap the containing div
's
.redBG {
background: red;
overflow: hidden;
}