Wie kan mij vertellen hoe ik mijn site kan centreren, de hele layout staat nu rechts. Ik zou graag de site in het midden van je computerscherm willen hebben.

Alvast bedankt voor de hulp

irene
css
----------
#container { margin: 0 auto 0 auto; width: 960px; }

html
----------
<div id="container">content</div>

* margin : 0 auto.... zorgt ervoor dat de div in het midden staat, en deze div moet ook vaste breedte hebben. De rest van de content zet je in deze container div.

succes
Aphichat Panjamanee schreef op 17.03.2009 18:58
css
----------
#container { margin: 0 auto 0 auto; width: 960px; }

html
----------
<div id="container">content</div>

* margin : 0 auto.... zorgt ervoor dat de div in het midden staat, en deze div moet ook vaste breedte hebben. De rest van de content zet je in deze container div.

succes


of korter:

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

Dit alleen gaat zeer waarschijnlijk niet werken :)

<?
div#container
{
	position: relative;
	left: 50%;
	width: 800px;
	margin: 0 0 0 -400px;
}


[quote]De <? heb ik erbij gezet voor de highlight[/code]
Dreamweaver??

Bedankt voor de snelle reacties, helaas werken de tips niet.

ik heb ze allemaal geprobeert, zonder resultaat. Zo heb ik het als laatste in mijn stylesheet gezet:

container {
position: relative;
left: 50%;
width: 800px;
margin: 0 0 0 -400px;
}

Nog andere suggesties?
Irene
germaine schreef op 17.03.2009 20:25

container {
position: relative;
left: 50%;
width: 800px;
margin: 0 0 0 -400px;
}


Je moet wel een goede selector gebruiken, dus .container in geval van een class. Maar je zal wel een id gegeven hebben dus moet je #container gebruiken.

Ik denk zoiets, al weet ik niet wat je html is natuurlijk. Alles moet in de container div natuurlijk.

#container {
   width: 800px;
   margin-left: auto;
   margin-right: auto;
}

En dan nog wat je extra wilt natuurlijk.
http://www.phpfreakz.nl/artikelen.php?aid=115

Op het moment dat je met negatieve margins gaat werken heb je een probleem als het browser venster kleiner wordt dan de website. De oplossing die in het artikel op phpfreakz gegeven wordt is daarom 'beter'.
Nee.
De echte goede manier:

body {
text-align: center;
}
#container {
margin: 0 auto;
text-align: left;
width: 900px;
}

En volgens mij kan het ook zo:

body {
margin: 0 auto;
width: 900px;
}
#container {
margin: 0 auto;
900px;
}
Er is maar zelden een 'echte goede manier', er zijn meer wegen naar Rome.
De body zou ik zelf niet zo snel een breedte geven, tenzij het echt niet anders kan.
Maar IE6 doet wel moeilijk met de margin:auto. Op de body een text-align:center; en in je container een text-align:left; lost dat op (zoals Dragy zei).

Reageren