centreer site in IE met CSS

**Ralph van leenen** · 02-10-2008, 15:14

ik word er een beetje dol van,

ik probeer horizontaal te centreren met css. In firefox is het geen probleem, maar in IE wil het niet lukken.

ik heb een container div geplaatst waarin de rest van de site staat, in mn css bestand staat de volgende code:

Code:

#body {
margin: 0 0 20px 0;
     text-align: center;
    
}

#container {
   position: relative;
     margin-left: auto;
     margin-right: auto;
     width: 789px;
     text-align: left;
   }

heeft iemand enig idee?

**Jgast6354** · 02-10-2008, 15:16

De container (waar dus alles in zit) moet je op margin: 0 auto; zetten. Probeer dat eens in plaats van aparte margin met auto.

**Harmen Vogel** · 02-10-2008, 15:20

je moet container zo doen:

#container{
margin: 0px auto 0px auto;
}

**Ralph van leenen** · 02-10-2008, 15:21

Hoi Jordi,

helaas n og geen resultaat, ik heb nu:

Code:

#container {
   position: relative;     
     margin:0 auto;
     width: 789px;
     text-align: left;
   }

ik heb voor beide browsers (firefox en ie) een aparte stylesheet gemaakt, maar hier zal het toch niet aan liggen?

Origineel gepost door Jordi Alferink

De container (waar dus alles in zit) moet je op margin: 0 auto; zetten. Probeer dat eens in plaats van aparte margin met auto.

**Ralph van leenen** · 02-10-2008, 15:22

ook niet :(

Origineel gepost door Harmen Vogel

je moet container zo doen:

#container{
margin: 0px auto 0px auto;
}

**Ralph van leenen** · 02-10-2008, 15:24

heb mn divs overigens gepositioneerd met position:absolute,

**Nova Webmedia** · 02-10-2008, 15:27

Laat die position is wegvallen :)

**gast2960** · 02-10-2008, 15:28

Origineel gepost door Ralph van leenen

heb mn divs overigens gepositioneerd met position:absolute,

position:absolute is nergens voor nodig, zet dit maar gewoon op:
position:relative;

body, html {
margin:0px auto;
}

#container {
margin:0px auto;
width:800px; /* eigen width invullen */
}

Dit moet werken ;)

**Aron de Haas** · 02-10-2008, 15:32

#container {
height: auto;
text-align: left;
margin-left: auto;
margin-right: auto;

padding: 0px;
}
body {
text-align: center;
padding: 0px;
margin: 0px;

**Ralph van leenen** · 02-10-2008, 15:33

nog niet,

de rest van de stylesheet gaat dus zo verder:

Code:

#dakpannentemplate-fwr1c1 {
    position:absolute;
    left:0px;
    top:0px;
    width:789px;
    height:29px;
    z-index:1;
    visibility:visible;
}
#dakpannentemplate-fwr2c1 {
    position:absolute;
    left:0px;
    top:29px;
    width:53px;
    height:39px;
    z-index:2;
    visibility:visible;
}

ik heb gesliced vanuit macromedia fireworks en vervolgens geëxporteerd naar html, de absolute positionering wordt automatisch toegevoegd

**Harmen Vogel** · 02-10-2008, 15:44

linkje stond er al.. oops:)

maar... bij mij in FF staat site in het midden...

**gast2960** · 02-10-2008, 15:44

Je moet aan de html ook nog een Doctype geven.

Wanneer je de <html> tag verandert in dit:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml">

En daarna opvolgt wat ik in m'n vorige post heb gezet, dan werkt het als het goed is helemaal ;)

**Ralph van leenen** · 02-10-2008, 15:54

Firefox is idd geen probleem,

@Gijsbert, shoot me, nog steeds niet! ik heb het idee dat de container div niet de hele site pakt, ik had net alleen de header gecentreerd, de rest niet..

**gast2960** · 02-10-2008, 16:00

Omslaat de container wel alle divs? Dat kan je testen door #container tijdelijk
background:#ff0000; mee te geven. Wanneer je ziet dat de container helemaal niet onder de andere divs uitkomen kan je proberen #container dit mee te geven:
overflow:hidden;

**Ralph van leenen** · 02-10-2008, 16:10

opdit moment heb ik:

Code:

body, html {
margin:0px auto;
}

#container {
margin:0px auto;
width:789px; /* eigen width invullen */
background:#ff0000;
overflow:hidden; 

}

ik zie geen gekleurde div, dus daar zit dan het probleem denk ik?

centreer site in IE met CSS