Div'en går utover de andre Div's, Hva gjør jeg?

[makeway] · 15. mars 2005

Hei!

Har et lite problem. Den ene diven (left) går utover de andre div's. Veit ikke helt hvordan jeg skal forklare det, så jeg har lagt bilder og css inn:

Internet Explorer

Firefox

<style type="text/css" media="screen">
* {
margin: 0;
padding: 0;
}

body {
background-color: #ECECEC;
color: #000000;
font-size: 8pt;	
font-family: "Trebuchet MS", Verdana, arial, Tahoma, sans-serif;
text-align: center;
}

a { 
   color: #C7E813;
   font-size: 11px;
   background-color:transparent;
   text-decoration: none;
}

pre { 
   color: #564b47;
   font-size: 11px;
   background-color: #fefefe;
   font-family: Courier, Monaco, Monospace;
}

p,h1, h3, pre {
   padding: 5px 4px;
   margin: 0px;
}

h3 {
   font-size: 13px;
   text-transform:uppercase;
   color: #FFFFFF;
   background-color: transparent;
}

#main {
width: 700px;
margin: 0px auto;
text-align: left;
padding: 20px;
height: 400px;
left: 202px;
background-color: #FFFFFF;
border-left: 5px solid #E4E4E4;
border-right: 5px solid #E4E4E4;
}

#footer {
width: 700px;
margin: 0px auto;
text-align: right;
padding: 20px;
height: 30px;
left: 202px;
background-color: #FFFFFF;
border-left: 5px solid #E4E4E4;
border-right: 5px solid #E4E4E4;
}

#left {
width: 410px;
text-align: left;
background-color: #ffffff;
border-right: 1px #AFCB17 solid;
float: left;
}

</style>

Dere må forklare det på no0b språk, er ikke helt trygg på css enda... Takk

Drømmemannen · 15. mars 2005

Du bruker ikke height="100%" inni #left-diven et sted? Ser ut som om IE setter #left til å ha 100% høyde i forhold til #main, mens FF setter #left til å ha 100% høyde i forhold til skjermoppløsningen.

I #main og #footer har du margin: 0px auto; OG left: 202px; Ingen grunn til å sette avstanden fra venstre når du vil midtstille siden. left: 202px har ingen funksjon i koden din.

Edit: Stavefeil

Endret 15. mars 2005 av balletryne

Haraldson · 16. mars 2005

Legg inn en

<hr style="clear: both; visibility: hidden;">

nederst i den ytterste diven

Arve Systad · 16. mars 2005

Her er en god beskrivelse av problemet.

[makeway] · 16. mars 2005

skjønte ikke helt Mr.Berg :no: - noen som vet hva han mente???

halvardm · 16. mars 2005

Ja, har du en div rundt div'ene dine?

En container div eller en wrap div eller noe i den duren?

Den koden som Mr. Berg skrev skal du legge helt nederst i en slik div og da skal problemet forsvinne.

Edit: 2323 innlegg

Endret 16. mars 2005 av Skomaker

[makeway] · 16. mars 2005

Hvis det hjelper noe så har jeg link til siden HER

Endret 16. mars 2005 av [makeway]

halvardm · 16. mars 2005

Linken virker ikke..

[makeway] · 16. mars 2005

nå virker den :yes:

lodott · 16. mars 2005

,16/03/2005 : 15:32] skjønte ikke helt Mr.Berg - noen som vet hva han mente???

Tror han mente at du skulle legge til

<hr style="clear: both; visibility: hidden;">

nederst i den diven hvor du har plassert tekst nå.

Så at du har satt height: 400px; på #main-diven. Lurer på om det gjør at den ikke vil utvide seg tilsvarende som diven med tekst i. Prøv å fjerne det.

Ellers så så jeg at css`en din er inni htmlfilen din. Det blir ofte ganske rotete, så jeg vil anbefale deg å lagre den i en egen .css fil. Dette gjør du ved å legge til

<link rel="stylesheet"  type="text/css" href="navnpåcssfil.css" />

i <head> delen av html dokumentet ditt.

Endret 16. mars 2005 av lodott

[makeway] · 17. mars 2005

har gjort det dere sier men den kødder bare med meg :cry:

Her er koden til min html:

<body>
<div id="main">
 <div id="left">
   <hr style="clear: both; visibility: hidden;"></div>
</div><div id="footer"></div>
</body>
</html>

CSS:

* {
margin: 0;
padding: 0;
}

body {
background-color: #ECECEC;
color: #000000;
font-size: 8pt;	
font-family: "Trebuchet MS", Verdana, arial, Tahoma, sans-serif;
text-align: center;
}

a { 
   color: #C7E813;
   font-size: 11px;
   background-color:transparent;
   text-decoration: none;
}

pre { 
   color: #564b47;
   font-size: 11px;
   background-color: #fefefe;
   font-family: Courier, Monaco, Monospace;
}

p,h1, h3, pre {
   padding: 5px 4px;
   margin: 0px;
}

h3 {
   font-size: 13px;
   text-transform:uppercase;
   color: #FFFFFF;
   background-color: transparent;
}

#main {
width: 700px;
margin: 0px auto;
text-align: left;
padding: 20px;
background-color: #FFFFFF;
border-left: 5px solid #E4E4E4;
border-right: 5px solid #E4E4E4;
}

#footer {
width: 700px;
margin: 0px auto;
text-align: right;
padding: 20px;
height: 50px;
background-color: #FFFFFF;
border-left: 5px solid #E4E4E4;
border-right: 5px solid #E4E4E4;
}

#left {
width: 410px;
text-align: left;
background-color: #ffffff;
border-right: 1px #AFCB17 solid;
float: left;
height="100%"
}

Endret 17. mars 2005 av [makeway]

Logg inn

Div'en går utover de andre Div's, Hva gjør jeg?

Anbefalte innlegg

[makeway]

Lenke til kommentar

Videoannonse

Drømmemannen

Lenke til kommentar

Haraldson

Lenke til kommentar

Arve Systad

Lenke til kommentar

[makeway]

Lenke til kommentar

halvardm

Lenke til kommentar

[makeway]

Lenke til kommentar

halvardm

Lenke til kommentar

[makeway]

Lenke til kommentar

lodott

Lenke til kommentar

[makeway]

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer