problem z szablonem - pomocy...

[kiler82]

WItam forumowiczów.
Mam pewien problem z układem w szablonie.
Chciałbym uzyskać taki układ jak na szkicu:
5179

Poniżej podaję co dotychczas udało mi się osiągnąć z pomocą jednego z forumowiczów (Heyek - bez Ciebie bym nie zaczął).
Wszystko się niby poprawnie wyświetla. Po załadowaniu dowolnych modułów do box1 i box2 wszystko jest ok.
Problem pojawia się gdy zamieszczam moduł w box3 lub box4. Wtedy rozjeżdża się wszystko :(
Czy ktoś patrząc na dotychczasowe zmagania widzi, gdzie może być błąd ?
Dodam jeszcze że do pliku: templateDetails.xml: dodałem pozycje (slideshow, box1, box2, box3, box4)
Wsyztsko do obejrzenia na www.gilbertrugby.pl (http://www.gilbertrugby.pl) (moduł newslash obecnie w box3 (wyswietla sie niby prawidlowo), ale w box 2 jest modul logowania sie i zsuniety jest ponizej "bigboxa".
Z góry dziękuje za pomoc !!


index.php



<div id="big_box">


<?php if($this->countModules('slideshow')): ?>
<div id="slideshow">
<jdoc:include type="modules" name="slideshow" />
</div>
<?php endif; ?>




<?php if($this->countModules('box1')): ?>
<div id="box1">
<jdoc:include type="modules" name="box1" />
</div>
<?php endif; ?>




<?php if($this->countModules('box2')): ?>
<div id="box2">
<jdoc:include type="modules" name="box2" />
</div>
<?php endif; ?>




<?php if($this->countModules('box3')): ?>
<div id="box3">
<jdoc:include type="modules" name="box3" />
</div>
<?php endif; ?>




<?php if($this->countModules('box4')): ?>
<div id="box4">
<jdoc:include type="modules" name="box4" />
</div>
<?php endif; ?>

</div>



CSS
#big_box{
margin-left: auto;
margin-right: auto;
margin-top: 10px;
width: 955px;
height: 300px;
}


#slideshow{
width: 500px;
height: 300px;
}


#box1{
width: 220px;
height: 145px;
padding: 1px;
margin-left: 505px;
margin-top: -300px;
}


#box2{
width: 220px;
height: 145px;
padding: 1px;
margin-left: 505px;
margin-top: 5px;
}


#box3{
width: 220px;
height: 145px;
padding: 1px;
margin-left: 730px;
margin-top: -300px;
}


#box4{
width: 220px;
height: 145px;
padding: 1px;
margin-left: 730px;
margin-top: 5px;
}

@palyga007
jak już wrzucasz "kod" to chociaż umieszczaj go w przeznaczonych do tego celu znacznikach.

[naszemiasto]

Na twoim miejscu zainteresowałbym się właściwościami float oraz position:relative dla tych #box1-box4
W ten sposób co masz zrobione wcale się nie dziwię że to wszystko się rozlatuje.