Kłopot z ustawieniem bloków

[Dvan 0]

Witam, posiadam sobie taki fragment kodu html:

 

 

<div id="top-line"></div>
<div id="c1">
<div id="c1left"></div>
<div id="c1right">$sMenu1</div></div>
<div id="c2">
<div id="c2left"><p><img src="xxx" /></p></div>
<div id="c2right"><div class="container"></div>

<img src="xxx" alt="xxx" /><a href="xxx"><img src="xxx" alt="xxx" /></a>
<a href="xxx"><img src="xxx" alt="xxx" /></a>
<a href="xxx"><img src="xxx" alt="xxx" /></a>
</div></div>
<div id="c3"><img src="xxx" alt="xxx" /></div>
<div id="c4"><div id="c5">$sMenu2</div></div>
<div id="c7">
<div id="c7left"><p><img src="xxx" /></p></div>
<div id="c7right"><div class="container"></div>

<img src="xxx" alt="xxx" /><a href="xxx"><img src="xxx" alt="xxx" /></a>
<a href="xxx"><img src="xxx" alt="xxx" /></a>
<a href="xxx"><img src="xxx" alt="xxx" /></a>
</div>

 

oraz taki fragment kodu css:

 

#top-line{width: 100%; height: 4px; background: #b10e17;}
#c1{width: 970px; margin: 0 auto; overflow: hidden; padding-bottom: 0px; height: 40px; margin-top: 14px; text-align: left;}
#c2{background-color: #ffffff; width: 970px; margin: 0 auto; overflow: hidden; padding-bottom: 0px; height: 70px; margin-top: 0px;}
#c3{background-color: #ffffff; width: 970px; margin: 0 auto; overflow: hidden; padding-bottom: 0px; height: 252px; margin-top: 0px;}
#c4{background-color: #ffffff; width: 930px; margin: 0 auto; overflow: hidden; padding-bottom: 0px; height: 30px; margin-top: 0px; padding-left: 20px; padding-right: 20px;}
#c5{background-color: #6f6a69; margin: 0 auto; overflow: hidden; padding-bottom: 0px; height: 45px; margin-top: 0px;}
#c7{background-color: #ffffff; width: 970px; margin: 0 auto; overflow: hidden; padding-bottom: 0px; height: 70px; margin-top: 0px;}

#c1left{float: left; text-align: left;}
#c1right{float: right; text-align: right; padding: 0px; padding-right: 0px; margin: auto;}
#c2left{float: left; text-align: left;}
#c2right{float: right; text-align: right; padding: 19px; padding-right: 20px; margin: auto; font-size: 10px;}
#c7left{float: left; text-align: left;}
#c7right{float: right; text-align: right; padding: 19px; padding-right: 20px; margin: auto; font-size: 10px;}

#container{position:relative;float:left;width:100%;margin:0 auto;padding:0 0 30px;}

 

Wyszło tak, że na górze w bloku c2 wszystko jest ok - podzielone 2 kolumny, lewa i prawa. Natomiast mimo że w bloku c7 dałem to samo tylko zmieniłem nazwy to wszystko wyświetla się w poziomie - lewy div c7left nad prawym divem c7right. Próbowałem z <div class="..."> w Operze działało tylko <div id="..."> na oba bloki ku mojemu zdziwieniu a natomiast w chrome już nie.

 

Liczę na Waszą pomoc i Pozdrawiam

Edytowano Maj 8, 2012 przez Dvan (zobacz historię edycji)

[Krzysztof Baraniak 8]

Nie wklejałem tego kodu i nie testowałem ale problemem może być na przykład to że oba divy obok siebie nie mieszczą się. Jakbyś mógł wrzucić gdzieś tą 'stronkę' to na żywo spróbuję Tobie pomóc.