[ Milos911 @ 01.06.2011. 11:36 ] @
Napravio sam ovo:
Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
    margin-left: 20%;
    margin-top: 30%;
    margin-right: 50%;
}
#head {
    position: absolute;
    height: 20%;
    width: 100%;
    left: 0px;
    top: 0px;
    background-color: #09F;
}
#left_sidebar {
    height: auto;
    position: absolute;
    left: 0;
    top: 20%;
    right: 80%;
    bottom: 0px;
    background-color: #9FF;
}
#dedicated_server_list {
    position: absolute;
    top: 20%;
    left: 20%;
    width: 80%;
    background-color: #FF9;
}
#edit_dedicated {
    position: relative;
    right: 50%;
    top: 0px;
    background-color: #CFF;
    left: 0%;
    bottom: auto;
}
#add_dedicated {
    position: absolute;
    left: 50%;
    top: auto;
    bottom: auto;
}
-->
</style></head>

<body>
<div class="header" id="head">Content for  class "header" id "head" Goes Here</div>
<div id="left_sidebar">Content for  id "left_sidebar" Goes Here</div>
<div id="dedicated_server_list">Content for  id "dedicated_server_list" Goes Here</div>
<div id="edit_dedicated">Content for  id "edit_dedicated" Goes Here</div>
<div id="add_dedicated">Content for  id "add_dedicated" Goes Here</div>
<p>&nbsp;</p>
</body>
</html>

Ono sto ne mogu nikako da provalim je kako da prilepim id edit_dedicated i add_dedicated uz id dedicated_server_list, ali tako da kako se ovaj gore siri, ova dva ostaju ispod. I takodje me zanima da li je ovo ostalo ok? Help :)
[ Milos911 @ 01.06.2011. 17:41 ] @
Neko? Stvarno mi treba pomoc, nikako ne mogu da provalim kako ovo da uradim.
[ snake_master @ 01.06.2011. 18:02 ] @
Pogresan ti je CSS totalno.
Zasto koristis apsolutno pozicioniranje?

Ne znam sta u stvari hoces da dobijes ali evo nesto sam ti napravio ako sam dobro pogodio kakav layout zelis da dobijes.

ceo layout - 100%
left sidebar - floatovan levo
header - na vrhu
u main-content sam stavio dedicated server list
a ispod njega jedan do drugog su floatovani edit_dedicated i add_dedicated

Ako je to ono sto zelis.


Uzmi neku knjigu pa kreni sa CSS-om ovako kako si poceo ne valja odbaci tu zamisao da se sve absolutno pozicionira i da tako u stvari postavljas divove onde gde hoces da se nadju...

Pogledaj i ovo: http://www.maxdesign.com.au/articles/css-layouts/

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
* {
    padding: 0;
    margin: 0;
}
body {
       
}
#head {       
       height: 20%;
       width: 100%;       
       background-color: #09F;
}
#left_sidebar {
    float: left;
    width: 30%;
       background-color: #9FF;
}
#main-content {
    float: right;
    width: 70%;
    overflow: hidden;
}
#dedicated_server_list {
       
       background-color: #FF9;
}
#edit_dedicated {
      float: left;
      width: 50%;
       background-color: #CFF;
     
}
#add_dedicated {
       float: left;
      width: 50%;
}
-->
</style></head>

<body>
<div class="header" id="head">Content for  class "header" id "head" Goes Here</div>
<div id="left_sidebar">Content for  id "left_sidebar" Goes Here</div>
<div id="main-content">
    <div id="dedicated_server_list">Content for  id "dedicated_server_list" Goes Here</div>
    <div id="edit_dedicated">Content for  id "edit_dedicated" Goes Here</div>
    <div id="add_dedicated">Content for  id "add_dedicated" Goes Here</div>
</div>
<p>&nbsp;</p>
</body>
</html>
[ Milos911 @ 02.06.2011. 14:21 ] @
Ma ovo mi je trebalo samo za prvu pomoc, odradio sam ceo projekat i bedak mi da klijentu posaljem rad sa razbacanim elementima. Pa sam uzeo dreamweaver, i koristio apsolutno pozicioniranje jer je samo ono radilo onako kako sam hteo :)
Inace, hvala ti za ovo sto si poslao, ali kad ga pokrenem izbaci mi ono sto cu zakaciti ispod poruke.
Ono sto me zanima je zasto header nije veci ako je height 20%? Ako stavim 200px napr, onda je ok, ali zasto nije sa procentima?
Inace, nisam uzeo knjigu jer sam hteo da naucim samo ono sto moram (a to je samo ovo pozicioniranje) pa sam mislio da koristim dreamweaver za pocetak. Guglao sam, i sve se zaebavao sa onim box modelom i objasnjenjima, i cudio se sto nista ne radi. Sad cu da malo da pogledam taj link sto si ostavio i da guglam na tu temu.
I jos jednom hvala na odgovoru :)
[ Br@nkoR @ 02.06.2011. 14:40 ] @
Citat:
Milos911
Ono sto me zanima je zasto header nije veci ako je height 20%? Ako stavim 200px napr, onda je ok, ali zasto nije sa procentima?


Height u procentima #head elementa se računa u odnosu body, odnosno html elementa, kada se napiše 20% predstavlja 20% od height body elementa, a pošto je height body/html elementa ima podrazumevanu vrednost auto zato se i to dešava. Pa je potrebno postaviti height body i html elementa na 100%.


[Ovu poruku je menjao Br@nkoR dana 02.06.2011. u 16:04 GMT+1]
[ Milos911 @ 07.06.2011. 11:46 ] @
Ljudi hvala, uspeo sam da napravim brdo stvari zahvljujuci vasim porukama :D