Le modèle de boite flexible CSS3 en action

Cette démo montre un squelette de blog entièrement structuré grace à ce modèle de boite

Positionnement des articles

Les articles ci-dessous se positionnent verticalement en suivant l'ordre du flux HTML.

Positionnement des champs de recherche

Les champs de formulaire sont positionnés sans utiliser de boites flottantes. Cela rend la gestion graphique des formulaires plus simple et plus consistante.

Article toujour positionné en tête de page

Cet article se positionne toujours en premier et est simplement mis en avant par un marqueur de classe. Son positionnement ne dépend pas du tout du flux HTML, mais de l'importance rédactionnel que lui accorde l'auteur. La même techniques est utilisé pour la mise en valeur d'un lien dans la colonne de gauche.

Support navigateur

Cette page sera correctement rendu en terme de positionnement dans Firefox, Safari et Chrome et tout autre navigateur récent basé sur Gecko ou Webkit.

Positionnement du pied de page

Le modèle de boite flexible permet de résoudre un problème récurant de webdesign : placer le pied de page en bas de la zone visible si le contenu ne prend pas tout l'espace disponible (il faut un grand écran pour s'en rendre compte).