Question

I have a div that I would like to have a border and background-color, but the container has collapsed because everything is floated.

This can be see at http://jsfiddle.net/5DNFs/

How do I get the <div class="due-total"> to have the border and background-color?

Answer 1

Clear your floats : My Fiddle

Note: Just changed border color so that you can see, you can change it to whatever you want

HTML

<div class="invoice-totals">   
    <div class="total">
        <div class="label">TOTAL</div>
        <div class="value">133.00</div>
    </div>

    <div class="paid-total">
        <div class="label">Payments</div>
        <div class="value">0.00</div>
         <div style="clear: both;"></div>
    </div>

    <div class="due-total">
        <div class="label">AMOUNT DUE</div>
        <div class="value">133.00</div>
         <div style="clear: both;"></div>
    </div>
</div>