Content horizontaal en verticaal centreren

Soms wil je content zowel verticaal als horizontaal centreren. Zo ook voor een klant van ons. Als je maar lang genoeg op google bladert en wat met je eigen kennis aan de gang gaat kom je tot mooie oplossingen:

CSS:

body { padding:0px; margin:0px; }

#wrapper { top: 50%; /* ga naar het midden van de pagina */ left: 50%; height: 400px; /* bepaal de grootte van het block */ width: 400px; margin-left: -200px; /* halveer de grootte en verschuif negatief */ margin-top: -200px; position: absolute; } /* aanvullend, puur voor het voorbeeld */ #wrapper { border: 1px dotted #666666; }

HTML:

Updated: Site is live, dus de link mag erop.