Left Margin is being ignored - html

Question

I'm trying to figure out why contact and disclaimer divs are ignoring the left margin.
http://jsfiddle.net/RLdYC/4/
HTML:
<!-- Package 1 -->
<div class="package2">
<div class="pkgtop">
<div class="pkgtype"> <span id="ratings">SINGLE PANEL</span> </div>
<div class="pkgcost"><sup class="dolladollabill">$</sup><span id="cost">4,100</span></div>
<center><div class="pkglength">PER FOUR WEEKS</div></center>
</div>
<div class="pkgbottom">
<div class="pkgselect">Select Plan</div>
<ul class="pkgdesc">
<li><span id="panelnum">1</span> Panels</li>
<li><span id="impressions">400K</span> Impressions</li>
<li>Reach: <span id="reach">15.2%</span> </li>
</ul>
</div>
</div>
<div class="contact">why are you ignoring the left margin?</a></div>
<div class="disclaimer">disclaimer</div>

Answer 1

If you inspect the layout using the Inspector in firefox or firebug you can see that a margin of 15 is applied to the contact div. However the left half of the contact div with the margin is hidden behind the floated package2 div and the text in the contact div is just pushed over.
If you want to have the whole div lined up next to the package2 div then you can do as Micallef suggested and use float:left on the contact/disclaimer div(s).
You can also change to use table layout (display:table-row, display:table-cell) if you do not want the contact/disclaimer to drop down underneath the package2 when the view width is not wide enough.
.package-row {
display: table-row;
}
.package2 {
...
display: table-cell;
}
.contact {
...
display: table-cell;
}
.disclaimer {
...
display: table-cell;
}
http://jsfiddle.net/AJw7x/1/

Answer 2

Adding float:left will solve the problem - jsfiddle
.contact{
margin-left:15px;
color:#000;
font-size:16px;
line-height:16px;
height:auto;
float:left;
}
.disclaimer{
margin: 15px 15px 15px 15px;
color:#939292;
line-height:15px;
font-size:14px;
height:auto;
float:left;
}