Le centrage vertical de blocs composites
Voir les tests de centrage vertical sur une unique ligne et centrage horizontal et vertical
Centrage d'un texte composite avec une illustration en position absolue
Position de l'illustration
L'illustration est placée hors flux avec position:absolute; left:0;
Le conteneur doit être pris en référence avec position:relative;
L'illustration est centrée par top:50%; margin-bottom:-h/2; (h: hauteur de l'illustration)
correctif pour IE6 : La position absolue de l'illustration necessite que le conteneur ait le layout (ex float:left)
Position des textes
Les textes sont dans le flux en display:block;
Chaque bloc laisse la place de l'illustration avec padding-left:w; (w: largeur de l'illustration). Le padding exprimé en em varie d'un bloc à l'autre puisque la référence pour 1em est le font-size du bloc lui-même.
Aucun centrage vertical n'est nécessaire pour les blocs de textes.
La largeur n'a pas besoin d'être précisée.
Ut labore.
Ullamco laboris.
In reprehenderit in voluptate ullamco laboris nisi duis aute irure dolor.
Ut labore.
Excepteur sint occaecat ullamco laboris nisi quis nostrud exercitation. Qui officia deserunt sunt in culpa ut aliquip ex ea commodo consequat. Cupidatat non proident, sed do eiusmod tempor incididunt.
In reprehenderit in voluptate ullamco laboris nisi duis aute irure dolor.
Ut labore.
Excepteur sint occaecat ullamco laboris nisi quis nostrud exercitation. Qui officia deserunt sunt in culpa ut aliquip ex ea commodo consequat. Cupidatat non proident, sed do eiusmod tempor incididunt.
In reprehenderit in voluptate ullamco laboris nisi duis aute irure dolor.