[es] - Position

LazniError

Član broj: 126903
Poruke: 23
*.adsl.beocity.net.

Profil

^{17.02.2007. u 08:23 - pre 209 meseci}

Dakle recimo da imate ovakav zadatak:

treba da se napravi baner (header) dimenzija recimo 800x200 koji stoji na vrhu stranice i u okviru kog recimo treba negde sa leve strane da se nalazi logo firme a negde pri kraju desno da se nalazi recimo vertikalni meni sa četiri pet stavki ili bilo sta drugo.
E sad recimo da je sam baner jedan div - mene zanima kako da u okviru tog jednog diva (headera) pozicioniram ostale elemente tacno kako ja zelim tj da mi je logo levo tacno gde zelim, a meni desno, takodje ako imam jos neki tu element da njega stavim gde zelim....
Dakle na koji nacin vi pozicionirate elemente uokviru jednog div-a?

Hvala

Odgovor na temu

Rafael Pupovac
Beograd

Član broj: 108950
Poruke: 106
*.adsl.beocity.net.

Profil

Re: Position - CSS ?

^{21.02.2007. u 22:07 - pre 209 meseci}

Nisam siguran da li sam bas najbolje razumeo, ali da probamo :)

HTML fajl bi ti imao sledeci deo:

Code:

<div class="header">
     <div class="left">
     </div>
     <div class="right">
     </div>
</div>

CSS fajl bi imao sledeci deo:

Code:

.header {
     height:200px;
     width:800px;
     background:#d2d2d2;
}

.left {
     height:200px;
     width:200px;
     background:#69c;
     float:left;
}

.right {
     height:200px;
     width:400px;
     background:#960000;
     float:right;
}

Sta ces dobiti sa gornjim kodom?
Header sirine 800px i visine 200px, sa sivom pozadinom
Levu stranu sirine 200px, sa svetlo plavom pozadinom
desnu stranu sirine 400px, sa bordo pozadinom

Izmedju leve i desne strane ce ti ostati jos 200px slobodnog prostora.

Nadam se da je ovo ono sto si trazio.

MVP.rs - Košarkaški Portal
Yachting Montenegro

Odgovor na temu

CtrlAltDel
Beograd

Član broj: 96286
Poruke: 325
*.ADSL.neobee.net.

Profil

Re: Position - CSS ?

^{21.02.2007. u 23:03 - pre 209 meseci}

hm... mislim da je covek ovo trazio. mada tesko ga je razumeti kako je objasnio...

<div style="position:relative; width:800px; height:200px">

<div style="position:absolute; left:10px ; top:10px">logo</div>
<div style="position:absolute; left:200px ; top:50px">nesto drugo</div>

<div>

eto to ti je primer pa se igraj kako ti odgovara...

Odgovor na temu