positionere overfor hinanden css

Hej!

Jeg skal have pladseret fire felter med div, to felter i to rækker (som Dannebrog). Disse fire felter ligger alle inde i en anden div...

Her er hvad jeg har skrevet - men hvad gør jeg forkert. Det har nok noget med float at gøre...

Denne er "hovedrammen"

#mainShowcase{
position:relative;
width:661px;
float:right;
margin-top:10px;
background-color:transparent;
z-index:15;
margin-bottom:10px;
}

Her er de fire felter

#ms1{
position:relative;
float:left;
width:310px;
margin-top:15px;
background-color:#415e85;
z-index:10;
}

#ms2{
position:relative;
float:left;
width:310px;
margin-top:15px;
background-color:#696969;
z-index:10;
}

#ms3{
position:relative;
float:right;
width:40px;
margin-top:15px;
background-color:#415e85;
z-index:10;
}

#ms4{
position:relative;
float:right;
width:40px;
margin-top:15px;
background-color:#696969;
z-index:10;
}