Master div a oddelena obsahova cast – CSS – Fórum – Programujte.com

Ahoj, narazil jsem na problem,
delam stranku, ktera mi v ie7 dobre funguje, ale nejde ani v mozile ani v opere,
problem se projevuje takhle:
mam stranku, na mi vycentrovany master div a v nem pod sebou divy HEADER a OBSAH, kolem masterdivu je okraj a ten mi konci v opere a mozile presne pod HEADER divem, takze OBSAHovy div je nejak mimo,
nevite cim by to mohlo byt?

zdroj webu:
<div class="MasterBox">
<div class="Header">
</div>
<div class="Content">
<div class="ContentLeft">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
<div class="ContentCenter">
<asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
</asp:ContentPlaceHolder>
</div>
<div class="ContentRight">
<asp:ContentPlaceHolder ID="ContentPlaceHolder3" runat="server">
</asp:ContentPlaceHolder>
</div>
</div>
</div>

a css:
.MasterBox
{
border: 1px solid #000000;
background-color: #81AB37;
position: relative;
width: 770px;
margin: auto;
text-align: left;
}
.Header {
background-image: url('/App_Themes/Default/Header.jpg');
position: relative;
width: 770px;
height: 260px;
}
.Content {
}
.ContentLeft {
width: 180px;
border-right-style: dotted;
border-right-width: 1px;
border-right-color: #000000;
float: left;
text-align: right;
padding-bottom:10px;
padding-left:10px;
padding-right:10px;
}
.ContentRight {
width: 200px;
border-left-style: dotted;
border-left-width: 1px;
border-left-color: #000000;
float: left;
}
.ContentCenter {
float: left;
width: 368px;
}

diky moc

ContentRight/Left/Center majú nastavenú vlastnosť float, takže neovplyvňujú výšku Content-u. Jeho výška je tým pádom nulová, spodný okraj MasterBox-u je hneď pod headerom a ContentRight/Left/Center z neho vytŕčajú (Content nie). Jedným z riešení je napríklad pridať za div.ContentRight prázdny div a nastaviť mu v css "clear:both".