Archief - HTML/CSS: centreren

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
G

GADGET

Legacy Member
Ik heb in photoshop iets gemaakt en dan voor web gesaved etc,

maar nu zou ik da graag nog gecentreerd krijgen, zowel verticaal als horizontaal.

Ik heb al wa gezocht en dacht het gevonden te hebben met die margins, maar op een andere resolutie staat dat dan weer niet gecentreerd :sad:

http://www.quercustuinen.be

bedankt
G

GADGET

Legacy Member
ja, kan mij herinneren dat ik daar ook mee heb zitten prutsen :$

http://www.quercustuinen.be/index2.html

dit heb ik als resultaat :cry:

PHP: 
<style type="text/css">
.gecentreerd
{
position:absolute;
left:50%;
top:50%;
width:657px;
height:405px;
margin-left:-249px;
margin-top:-82px;
background-color:none;
}
</style>

dit heb ik nu tussen head /head gezet

PHP: 
<div class='gecentreerd'>
onder body

en
PHP: 
</div>
boven /body :p

en die waarden van hoogte en breedte heb ik van
PHP: 
<table id="Table_01" width="657" height="405" border="0" cellpadding="0" cellspacing="0">
S

Smoerf

Legacy Member
En laat me eens raden, het staat niet mooi horizontaal en verticaal gecentreerd?

Nogal logisch me dunkt.

1) je zet je position abolute
2) je geeft je top en left 50% mee als waarde, maar nu begint je div maar aan de helft van je pagina (zowel van boven als vanonder)
3) je zet je margin-top op de helft van je hoogte van je div en je margin-left op de helft van de breedte van je div. Hierdoor is het midden van je div (hor en ver) het midden van je pagina (hor en ver)

dus je css zou er als volgt moeten uitzien
Code: 
<style type="text/css"> 
.gecentreerd 
{ 
position:absolute; 
left:50%; 
top:50%; 
width:658px; 
height:406px; 
margin-left:-329px; 
margin-top:-203px; 
background-color:none; 
} 
</style>
B

Brock

Legacy Member
div.centreer{margin:10px auto 0px;width:658px;}

lijkt me eenvoudiger
S

Smoerf

Legacy Member
Ik ken zelfs iemand die dit doet:

Code: 
body{
   margin:0px auto;
   width:658px;
}

En dan is het gecentered horizontaal, maar niet verticaal :s (Dat kan toch semantisch niet correct zijn? En dan bedoel ik een breedte meegeven aan je body...)
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan