Il s'agit cette fois de gérer la mise en page des images dans le texte de façon plus souple, plus intuitive et moins lourde en code qu'avec des tableaux.

Nous allons voir l'utilité des valeurs left, right et all appliquées à <br clear>. Prenons deux images et un texte (qui contient trois instructions <br> simples) mis bout à bout :

Redécouvrez les carillons de Toulouse à travers celui de la basilique Saint-Sernin.
Deux de ses cloches sont remarquables et classées Monument historique : la Mercédaire (XIV^e siècle) et la Sarnino (XVII^e).
Cette dernière cloche est la plus grosse, pesant plusieurs tonnes et au joug majestueux équilibré pour sonner en volée tournante, tout comme les fameuses demoiselles de Louison.

Un petit peu de mise en page. A chaque image, appliquons une balise différente : align=left et align=right qui placent respectivement les images en marge gauche et droite de la page. Remarquez le résultat difficile à obtenir avec des tableaux. (On écartera le texte de l'image avec par exemple hspace=5 dans le code de l'image, hors de propos ici.)

Redécouvrez les carillons de Toulouse à travers celui de la basilique Saint-Sernin.
Deux de ses cloches sont remarquables et classées Monument historique : la Mercédaire (XIV^e siècle) et la Sarnino (XVII^e).
Cette dernière cloche est la plus grosse, pesant plusieurs tonnes et au joug majestueux équilibré pour sonner en volée tournante, tout comme les fameuses demoiselles de Louison.

Voyons l'effet de <br clear=left> sur le premier retour chariot : le texte va être descendu jusqu'à ce que la marge de gauche soit libre, permettant par exemple de légender la seule image de gauche.

Redécouvrez les carillons de Toulouse à travers celui de la basilique Saint-Sernin.
Deux de ses cloches sont remarquables et classées Monument historique : la Mercédaire (XIV^e siècle) et la Sarnino (XVII^e).
Cette dernière cloche est la plus grosse, pesant plusieurs tonnes et au joug majestueux équilibré pour sonner en volée tournante, tout comme les fameuses demoiselles de Louison.

Maintenant l'effet de <br clear=right> toujours sur le premier retour chariot : le texte va être descendu jusqu'à ce que la marge de droite, cette fois-ci, soit libre.

Redécouvrez les carillons de Toulouse à travers celui de la basilique Saint-Sernin.
Deux de ses cloches sont remarquables et classées Monument historique : la Mercédaire (XIV^e siècle) et la Sarnino (XVII^e).
Cette dernière cloche est la plus grosse, pesant plusieurs tonnes et au joug majestueux équilibré pour sonner en volée tournante, tout comme les fameuses demoiselles de Louison.

Avec <br clear=all>, les marges gauche et droite sont libérées. Le texte descend en fait au-dessous de la plus grande des deux images à gauche et à droite, ce qui ne change rien comparé à l'exemple précédent, mais permet de ne pas se demander dans quelle marge se trouve la plus grande image.

Redécouvrez les carillons de Toulouse à travers celui de la basilique Saint-Sernin.
Deux de ses cloches sont remarquables et classées Monument historique : la Mercédaire (XIV^e siècle) et la Sarnino (XVII^e).
Cette dernière cloche est la plus grosse, pesant plusieurs tonnes et au joug majestueux équilibré pour sonner en volée tournante, tout comme les fameuses demoiselles de Louison.

N'hésitez pas à consulter la page souris-dessous pour un exemple de mise en page complexe mais harmonieuse, sans avoir recours aux tableaux.

Vous pouvez également regarder le code de ces pages pour toute précision et communiquer tout complément d'information à ce sujet ou toute trouvaille personnelle spectaculaire à l'œil.

Du même auteur, voir aussi L'Œil-de-bœuf
pour l'écriture correcte du mot chœur