Pozycjonowanie obraków - Wersja do druku

Kod:

<div class="srodkowy"><img src="images/wybierzgrupewiekowa.jpg" alt="wybierz grupę wiekową"/> </div>

<div class="lewy"><img src="images/podstawowa.jpg" alt="Podstawowa"/></div>

<div class="prawy"><img src="images/podstawowa2.jpg" alt="Podstawowa"/></div>



<style type="text/css">

.srodkowy {margin-left: 0px}

.srodkowy img {margin-left: 130px; margin-top: 80px;}

.lewy

{position:relative;

left: 350px;

bottom: 150px;}

.prawy {

position:relative;

left 350px;

bottom:190px;}

</style>

Kod:

[code]

<div id="kontener">

<div class="cleaner divider"/></div>

<div id="B">Obrazek i tekst +cleaner divider pod obrazkiem i tekstem</div>

cleaner2 divider2

<div id="C">Obrazek i tekst +cleaner divider pod obrazkiem i tekstem</div>

<div id="D">Obrazek i tekst +cleaner divider pod obrazkiem i tekstem</div>

cleaner2 divider2

<div id="E">Obrazek i tekst +cleaner divider pod obrazkiem i tekstem</div>



style :

.two-forth {

position:relative;

float: center;

width: 800px;

background:#fff;

padding-bottom:50px;

}

.cleaner {

clear: both;

}

.divider {

border-bottom-color: #8FA50A;

border-bottom-style: solid;

border-bottom-width: 2px;

margin-bottom: 20px;

padding-bottom: 20px;

}

h1 {font-size: 27px;}

h2 {font-size: 27px;}

h3 {font-size: 27px;}

h4 {font-size: 27px;}



.cleaner2 {

clear: both;

}

.divider2 {

border-left-color: #8FA50A;

border-left-style: solid;

border-left-width: 2px;

margin-left: 20px;

padding-left: 20px;

}

#kontener {width: 504px; margin: 0 auto; overflow: hidden;}

#B {width: 250px; height: 250px; background: red; float: left;}

#C {width: 250px; height: 250px; background: green; float: left;}

#D {width: 250px; height: 250px; background: black; float: left;}

#E {width: 250px; height: 250px; background: orange; float: left;}

koniec styli