View previous topic :: View next topic |
Author |
Message |
niksy
Joined: 29 Sep 2003 Posts: 727
|
Posted: 17.04.2005 20:18 Post subject: Pozicioniranje div-a i li-a, n00bish question... |
|
|
Krenuo sam se malo jace baviti sa CSS-om i izradom stranica koristenjem istog, pa me zanimaju mnoge stvari. Nemojte zamjeriti ako budem gnjavio sa prilicno pocetnickim pitanjima, ali nadam se da cu ovo uspjeti savladati .
Recimo da imam jedan div i unutar toga div-a neki tekst sa nekom klasom koja ga uredjuje. Sada kada napravim jos jedan div i unutar njega neki tekst, taj drugi div mi pokazuje ispod prvog div-a. Sad me zanima kako bih mogao taj drugi div staviti pored prvog. Pokusao sam sa definiranjem margina, placementa, paddinga - ma svime - ali nista.
Da li se ta ista metoda moze upotrijebiti sa <li>-jem jer mi se <li> cini kao bolja solucija?
Thanks in advance. |
|
|
Back to top |
|
|
godza
Joined: 17 Apr 2005 Posts: 19 Location: Novi Sad, SCG
|
Posted: 17.04.2005 20:22 Post subject: |
|
|
Aj pliz okachi kod (i html i CSS) |
|
|
Back to top |
|
|
Ilija Studen
Joined: 17 Apr 2005 Posts: 27 Location: 127.0.0.1
|
Posted: 17.04.2005 20:39 Post subject: |
|
|
Evo ga jedan prost primer (izrada klasičnog levog sidebara):
Code: | <div id="prvi">...</div>
<div id="drugi">...</div> |
Моžeš na dva načina: apsolutnim pozicioniranjem ili plutanjem. Ja više ovlim ovaj drugi pa ću njega i objasniti. Dakle, kažeš da prvi div pluta i stilizuješ ga:
Code: | #prvi {
float: left;
padding: 5px;
width: 150px;
} |
Za drugi staviš sledeće:
Code: | #drugi {
margin: 0 0 0 150px;
} |
Sada bi trebali da budu jedan pored drugog. Ne zaborvati da bi ispred trebao da bude još neki blok koji clearuje plutanje prvog diva.
Možda se sada čini kao malo zeznuto za skontati, ali polako. Pozicioniranje je možda najkompleksniji deo CSSa. Preporulčujem da projuriš netom i nađeš par tutorijala koji se time bave.
Poz |
_________________ Blog: Web dizajn, web razvoj, programiranje, random |
|
Back to top |
|
|
godza
Joined: 17 Apr 2005 Posts: 19 Location: Novi Sad, SCG
|
Posted: 17.04.2005 20:47 Post subject: |
|
|
drugi nacin je da ubacis dva diva koji float-uju levo
HTML
Code: |
<div id ="wrapper">
<div id="prvi"></div>
<div id="drugi"></div>
<div id="treci"></div>
</div>
|
CSS
Code: |
#wrapper {
width: 700px;
}
#prvi {
width: 300px;
float: left;
}
#drugi {
width: 390px;
float: left;
}
#treci {
clear: both;
}
|
Meni je laksi i ocigledniji ovaj drugi nacin, mada ni ilijin nije los |
|
|
Back to top |
|
|
niksy
Joined: 29 Sep 2003 Posts: 727
|
Posted: 18.04.2005 08:48 Post subject: |
|
|
Hvala puno obojici, oba nacina rade i super su.
Pa gledao sam dosta tutoriala sto se tice ovoga problema, no nisam nasao nikakvu soluciju, pa na kraju ostane mi3 . |
|
|
Back to top |
|
|
godza
Joined: 17 Apr 2005 Posts: 19 Location: Novi Sad, SCG
|
Posted: 18.04.2005 10:01 Post subject: |
|
|
np |
|
|
Back to top |
|
|
|