stort css spørsmål... håper på hjelp!

[Greven22]

Kan noen fortelle meg hva jeg må gjøre for at dette skal ligne et oppsett med en header, en inneholds div til høyre og en meny til venstre. Deretter en liten under div. nederst.

 

Nå ser det helt villt ut i IE, men funker noenlunde i Firefox!

 

 

#frame

{

height: 550px;

width: 800px;

margin-right:auto;

margin-left:auto;

margin-top:10px;

padding:0px;

text-align:left;

}

 

#contentleft

{

height: 555px;

width:150px;

padding:0px;

float:left;

background: transparent;

border-left:1px solid #CCC;

border-bottom:1px solid #CCC;

voice-family: "\"}\"s";

voice-family: inherit;

}

 

#contentcenter

{

width:644px;

height: 555px;

padding-left: 3px;

float:left;

background: transparent;

border-right: 1px solid #CCC;

border-left: 1px solid #CCC;

border-bottom:1px solid #CCC;

voice-family: "\"}\"s";

voice-family: inherit;

}

 

#contentheader

{

border: 1px solid #CCC;

background-image: url(../images/logo.jpg);

width: 100%;

height: 150px;

voice-family: "\"}\"s";

voice-family: inherit;

}

 

#contentbottom

{

height: 40px;

width: 800px;

text-align: right;

}

 

 

<div id="frame">

<div id="contentheader"> <.. logo!

</div>

 

<div id="contentleft">

menyen !!! bla bla bla

 

</div>

 

<div id="contentcenter">

innehold

 

</div>

 

<div id="contentbottom"> lala </div>

 

</div>

 

 

Vet det er enormt mye og sette seg inn i men håper noen gidder og prøve og hjelpe meg

 

På forhånd tusen takk!!

[PoleCat]

* {
margin: 0;
padding: 0;
}

body {
text-align: center;
}

#frame {
width: 800px;
margin: 10px auto 0 auto;
text-align:left;
}

#contentheader {
border: 1px solid #CCC;
background-image: url(../images/logo.jpg);
height: 150px;
voice-family: "\"}\"s";
voice-family: inherit;
}

#contentleft {
height: 555px;
width:150px;
float:left;
background: transparent;
border-left:1px solid #CCC;
border-bottom:1px solid #CCC;
voice-family: "\"}\"s";
voice-family: inherit;
}

#contentcenter
{
width:644px;
height: 555px;
padding-left: 3px;
float:left;
background: transparent;
border-right: 1px solid #CCC;
border-left: 1px solid #CCC;
border-bottom:1px solid #CCC;
voice-family: "\"}\"s";
voice-family: inherit;
}

#contentbottom {
clear:left;
height: 40px;
text-align: right;
}

 

<div id="frame">

 <div id="contentheader"></div>

 <div id="contentleft"></div>

 <div id="contentcenter"></div>

 <div id="contentbottom"></div>

</div>

[Greven22]

ahh.. ser knallbra ut..

 

Men hva mener du med *

 

Og hvorfor text-align=center skal jo ikke ha sentrert tekst

[Haraldson]

* er universalselektoren, gjelder for alle elementer.

text-align:center; er en måte å midtstille en side på for folk med eldre browsere som ikke støtter margin:0 auto;.

For å rette på dette bruker du bare text-align:left; på den diven du har teksten i

[Greven22]

okay, det ser fortsatt ikke ,helt, riktig ut... i IE:realmad:

 

I mozilla ser det ganske riktig ut bortsett fra at listene ( punktene ) går utenfor divene.. Har en egen #id for listene.. Noe jeg må legge til der?

 

Men jeg får prøve mer i morgen..

 

Et annet spørsmål... hva er dette ?

voice-family: "\"}\"s";

voice-family: inherit;

 

Og hva gjør det

Endret 28. juni 2004 av DiaVoLo

[PoleCat]

Voice-family

Aldri brukt det selv.

 

Lister: På grunn av at universalregelen er satt til 0, vil selve innholdet i listen begynne ved starten av sitt parent element, og dette inkluderer ikke bullets.

Det du da kan gjøre er enten å fjerne bulleten med list-style: none på li, eller legge til padding-left på ul.

Endret 28. juni 2004 av PoleCat

[Arve Systad]

den Voice family greia der er vel strengt tatt med for å fikse litt bugs i visse IE versjoner, trur eg.. Aldri brukt dei sjøl, og heller aldri anstrengt meg for å finne ut ka dei faktisk gjør heller