plassering av div'er med css

[toss]

jag har et lite problem..

jeg skal lage en side med følgende objekter:

 

 

#header og #main skal være midtstilt, og #navigation og #sidebar skal være på hver sin side av #main..

 

har prøvd med følgende kodei css:

  #header {
   border-style: solid;
   border-width: 2px;
   position: absolute;
   margin: 0 auto;
   margin-top: 0;
   width: 30em; 
   height: 3em;
   text-align: center;
 }


 #navigation {
   border-style: solid;
   border-width: 2px;
   margin-top: 3em;
   margin-left: 10;
   width: 10em;
 }


 #tabbetoppen {
   border-style: solid;
   border-width: 2px;
   margin-top: 5em;
   margin-right: 10em;
   width: 10em;
 }


 #main {
   border-style: solid;
   border-width: 2px;
   margin: 0 auto;
   margin-top: 4em;
   width: 30em;
 }

 

 

resultatet blir slik

 

noen som kan se noen feil?

Endret 24. august 2004 av toss

[pgdx]

Du kan for eksempel ikke bruke position absolute når du skal midtstille noe.

 

På de som skal ligge ved siden av hverandre kan du bruke float:left;

 

På header velger du kun margin:0 auto; men husk å sette html,body til 100% bredde.

[toss]

hvordan setter jeg html,body til 100%?

 

 html {
   body: 100%;
 }

slik?

mener å ha sett noe slikt et sted, men jeg kan ikke huske det..

[Cucum(r)]

html, body {
height: 100%;
}

[toss]

har prøvd å forandre på det dere påpekte, men resultatet blir ikke stort bedre: http://free.hostdepartment.com/t/toss/Forside.html

 

jeg kan jo selvsagt ha glemt eller misforstådt noe, så her er koden:

  #header {

   border-style: solid;
   border-width: 2px;
   position: static;
   margin: 0 auto;
   width: 30em; 
   height: 5em;
   text-align: center;


 }


 #navigation {

   border-style: solid;
   border-width: 2px;
   posision: static;
   float: left;
   width: 10em;



 }


 #tabbetoppen {

   border-style: solid;
   border-width: 2px;
   posision: static;
   margin-top: 5em;
   float: right;
   width: 10em;



 }


 #main {

   border-style: solid;
   border-width: 2px;
   posision: static;
   margin: 0 auto;
   margin-top: 0em;
   width: 30em;


 }

[pgdx]

Du kan fjerne position:satic; på alle, og legg til float:left på #main i tillegg til at du fjerner margin på #main.

[toss]

prøvde forandringene, men det ble ikke mye bedre..

http://free.hostdepartment.com/t/toss/Forside.html

 

 html, body {

   height: 100%;


 }


 #header {

   border-style: solid;
   border-width: 2px;
   margin: 0 auto;
   width: 30em; 
   height: 5em;
   text-align: center;


 }


 #navigation {

   border-style: solid;
   border-width: 2px;
   float: left;
   width: 10em;



 }


 #tabbetoppen {

   border-style: solid;
   border-width: 2px;
   margin-top: 5em;
   float: right;
   width: 10em;



 }


 #main {

   border-style: solid;
   border-width: 2px;
   flote: left;
   width: 30em;


 }

[Lemkin]

Sett opp html'en anderledes, navmenu først, main og sidebar. Har hatt problemer med sånn før, men etter å ha rota i html'en så kommer det seg

[toss]

av en eller annen grunn funker det ikke..

http://free.hostdepartment.com/t/toss/Forside.html

 

noen som kan se hva som er galt?

[sete]

Denne fungerer kun i Mozilla Firefox :!: Endret 26. august 2004 av sete

[toss]

vel jeg får det ikke til på noen måte..

 

kan noen gjøre meg den store tjenesten å skrive CSS-koden for meg?

pleeeezz? vet men ikke vanligvis gjør sånt, men jeg er hjelpeløs..

[Simon Zimmermann]

Fant en fin side idag: Maxdesign

Gjorde en liten toturial jeg fant på den websiden. Ligner kanskje ikke helt på det du er ute etter, men jeg regner med at dette hjelper deg et stykke i hvert fall.

 

Litt hjelp på veien