Au menu Design CSS, je vous propose un exemple de mise en pages classique composé d’un header, de deux colonnes et d’un footer. Pour profiter de l’avantage des CSS par rapport aux tableaux, je ferais en sort qu’en supprimant deux lignes dans la feuille de style CSS, nous passions de deux à une colonne.
Nous utiliserons la propriété float : elle permet au contenu de se placer à gauche ou à droite de celui qui le précède dans le flux. Nous attribuerons ensuite des valeurs en pourcentages à la propriété width de chaque colonne pour obtenir une largeur globale fixe ou liquide.
La largeur passe facilement d’une valeur relative à une valeur fixe en modifiant la valeur width du container. Les valeurs pour chaque colonne étant en pourcentage, elles s’adapteront parfaitement à vos exigences. Notez que je vous laisse le soin de bidouiller pour afficher fièrement chez vous l’exemple ci-dessous 😉
Et puis non, finalement, puisque vous le valez bien, je vous mâche le travail.
Mais je parle, je parle… et j’en oublierai presque d’aller me coucher 😉 Quant à vous, prenez encore dix minutes pour afficher le code source des exemples et amusez-vous, les CSS, s’est fait pour ça !
Comme d’habitude j’en apprends toujours un peu plus en passant par ce blog… Donc très bon l’utilisation des pourcentages pour définir la longueur des blocs. Idem pour l’association des styles (lier la class .cols avec .intro), je sais c’est un peu la base de la mise en page CSS mais bon j’ai encore un peu de mal :s !!!!!
Bref je mets ce code dans un coin cela peu toujours servir !!!!