Problem with floating divs in IE8
- by hivehicks
I want to make two block stand side by side. In Opera, Chrome and Firefox I get the expected result with the code I use. But IE8 refuses to display it correctly.
Here's IE8 screenshot: http://ipicture.ru/upload/100405/RCFnQI7yZo.png
And Chrome screenshot (how it should look like): http://ipicture.ru/upload/100405/4x95HC33zK.png
Here's my HTML:
<div id="balance-container">
<div id="balance-info-container">
<p class="big" style="margin-bottom: 5px;">
<strong>
<span style="color: #56666F;">??????:</span>
<span style="color: #E12122;">-2312 ???</span>
</strong>
</p>
<p class="small minor"><strong>????????? 1000 ???. ?? 1.05.10</strong></p>
</div>
<div id="balance-button-container">
<button id="pay-button" class="green-button">????????? ????</button>
</div>
</div>
And CSS:
#balance-container {
margin-left: auto;
margin-right: auto;
width: 390px;
}
#balance-info-container, #balance-button-container {
float: left;
}
#balance-info-container {
width: 250px;
}
