de ellende van verticaal centreren

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Java developer met testervaring

Java developer met testervaring Functieomschrijving "De drempel tussen de burger en de Belastingdienst zo laag mogelijk houden: dat is de belangrijke taak van ons team. Dit doen we door het burgerportaal Mijn Belastingdienst continu te verbeteren." René, Java-specialist bij de Belastingdienst. De keten Interactie is een samenwerkingsverband van alle dienstonderdelen binnen de Belastingdienst. Samen zorgen we dat het contact met burgers en bedrijven goed kan plaatsvinden. Onze belangrijkste opgave? Zoveel mogelijk digitaliseren. Dat doen we binnen het onderdeel Informatievoorzieningen (IV), de ICT-organisatie van de Belastingdienst. Denk bij de producten die IV-Interactie ontwikkelt en onderhoudt aan portalen, formulieren en authenticatie- en

Bekijk vacature »

Jeroen VD

Jeroen VD

09/05/2012 15:12:14
Quote Anchor link
zoals je aan de titel kunt zien: verticaal centreren vind ik een ramp. het lukt nooit! wat zijn tegenwoordig de beste technieken, zowel voor block als inline elementen?
 
PHP hulp

PHP hulp

23/10/2021 07:50:02
 
Wouter J

Wouter J

09/05/2012 15:32:50
 
Teun Hesseling

Teun Hesseling

09/05/2012 15:59:46
Quote Anchor link
Ik gebruik meestal dit stukje
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
#wrapper {width: 1024px; margin: 0px auto 0px auto; padding:0px 0px 0px 0px;}
Gewijzigd op 09/05/2012 16:00:26 door Teun Hesseling
 
Wouter J

Wouter J

09/05/2012 16:11:06
Quote Anchor link
Dat is dus voor horizontaal centreren.... En als je alleen horizontaal wilt centreren altijd jou code gebruiken, alleen verticaal centreren is -zoals jeroen zegt- een stuk moeilijker.

En tevens kan jou code een stuk korter:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
#wrapper
{
  width: 1024px; /* of welke breedte je ook maar wilt */
  margin: 0 auto;
  padding: 0;
}

Waarbij die padding: 0; niet nodig is voor het centreren.

Bij een 0 waarde hoeft er geen px achter. 0 is 0 ook in pixels. En je kunt margin, padding enzo inkorten via deze methode:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
margin: <margin-top> <margin-right> <margin-bottom> <margin-left>;
margin: <margin-top> <margin-right/left> <margin-bottom>;
margin: <margin-top/bottom> <margin-right/left>;
margin: <margin-top/bottom/right/left>;
 
Jeroen VD

Jeroen VD

09/05/2012 21:54:15
Quote Anchor link
Hmm oke, ik heb die tut doorgenomen, maar wat is het nut van dat ghost element?
 
Wouter J

Wouter J

09/05/2012 22:32:32
Quote Anchor link
Ik weet niet welke tut je bedoelt? Ik vind die eerste methode beter dan de 2e, dus heb je naar die 1e methode gekeken?

Als je .distance het ghost element noemt: die staat daar zodat het element nooit kan verdwijnen. Als je gewoon de trick met position absolute en negative - marges neemt en je verkleint je browser zul je zien dat het element verdwijnt. Met dat distance element voorkom je dit.
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.