Css Snippets » center http://www.csssnippets.be Snippets for you, snippets for me Wed, 23 Jun 2010 09:35:12 +0000 en hourly 1 http://wordpress.org/?v=3.0.1 Afbeeldingen horizontaal centreren http://www.csssnippets.be/2009/05/afbeeldingen-horizontaal-centreren/ http://www.csssnippets.be/2009/05/afbeeldingen-horizontaal-centreren/#comments Sun, 24 May 2009 08:39:35 +0000 Mark http://www.csssnippets.be/?p=229 Als je een afbeeldingen hebt waarvan de afmetingen altijd vooraf gekend zijn is het relatief eenvoudig om deze te centreren te opzichte van het parent element. Maar wat als je de afmetingen niet vanop voorhand weet, of dat de afmetingen niet altijd hetzelfde zijn??
Met volgende CSS Snippet kan je dit probleem oplossen.

Met gekende afmetingen

HTML

<div>
<img src="afbeelding.jpg" height="100" width="100" alt="omschrijving" />
</div>

CSS

div img {
margin: 0 auto;
width: 100px;
}

Ongekende/afwijkende afmetingen

HTML

<div>
<img src="afbeelding.jpg" alt="omschrijving" />
</div>

CSS

div#wrapper {
  width: 350px;
  text-align: center;
  border: 1px solid; /* ter illustratie */
}
Google Bookmarks Digg BlinkList Technorati del.icio.us StumbleUpon

]]> http://www.csssnippets.be/2009/05/afbeeldingen-horizontaal-centreren/feed/ 0 Centreren van pagina http://www.csssnippets.be/2009/05/centreren-van-pagina/ http://www.csssnippets.be/2009/05/centreren-van-pagina/#comments Sat, 16 May 2009 20:19:28 +0000 Mark http://www.csssnippets.be/?p=217 Om uw website in het midden te krijgen (centreren), is deze volgende CSS Snippet voldoende. Belangrijk is wel dat het element waarop je volgende code toepast daadwerkelijk dimensie heeft (zeker breedte).

HTML

<div id="foo">
tekst komt hier
</div>

CSS

#foo {
margin: 0 auto;
width: 800px;
border: 1px solid; /* ter illustratie */
}
Google Bookmarks Digg BlinkList Technorati del.icio.us StumbleUpon

]]> http://www.csssnippets.be/2009/05/centreren-van-pagina/feed/ 0