Le quotidien de l’intégrateur XHTML et CSS est parfois ponctué de vide *téléologique* concernant les bonnes balises à utiliser en fonction du type de contenu. J’ai longtemps cherché à produire un document-type pouvant servir à n’importe quelle commande. Hélas ! Chaque projet demande des réponses graphiques et structurelles ajustées. Néanmoins, je ne résiste pas au plaisir de partager avec vous, à l’occasion du 100ème jour depuis la mise en ligne de css4design, une sorte de medley mashup de quelques thèmes liés à l’intégration web. Restez vigilant : malgré toute l’attention apportée à la rédaction de ce billet, il reste encore des traces d’humour sous le tapis de souris. →
Vos positions s’affaissent ? Mettez le bottom à zéro…
Design de formulaire HTML avec CSS
Depuis longtemps, l’intégrateur web pressé d’aller manger, dresse la table pour mettre en forme ses formulaires. Et vas-y que je te mets du texte dans un td, un champ texte dans l’autre, et ce, jusqu’à la nausée. Désormais, plus d’excuses. Nous pouvons tous (oui, j’ai bien dit tous !) aligner des éléments de formulaires sans table. Mais pas sans les mains ni sans CSS. →
Design de formulaire : faites moche, c’est mieux !
Un point de vue intéressant au sujet du design des formulaires que je soumets à votre sagacité. Que ceci ne vous empêche pas de n’en faire qu’à votre tête et de continuer de styler vos formulaires pour le plaisir des yeux. Mais au moins vous serez prévenu : on ne joue pas impunément avec l’expérience utilisateur 😉
En-tête, 2 colonnes, 1 pied de page (fixe ou liquide)
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. →
Trucs et astuces CSS
Cette page regroupe des trucs & astuces CSS que j’ajoute régulièrement : bookmarkez, blogmarker, favorisez, bref faites tourner… Si vous cherchez plutôt des exemples de design CSS plus complets, les billets présents dans cette page consacrée au design web avec CSS devrait vous intéresser 😉
Si vous avez vous aussi quelques astuces CSS à partager, n’hésitez pas à le faire dans les commentaires.
- La feuille blanche
- Raccourci pratique pour les bordures CSS
- Transparence
- Commentaires conditionnels d’IE vs hacks CSS
- Barre de défilement et décalage d’une page centrée
- Centrer un bloc horizontalement et verticalement dans la fenêtre du navigateur
- Centrer un bloc horizontalement dans la fenêtre du navigateur
- Modifier les caractéristiques des liens avec LoVe HAte
Design CSS : fixe, élastique ou liquide ?
Difficile de choisir la bonne formule pour ses mises en pages CSS. Surtout si l’on se préoccupe des standards du W3C et des bonnes manières pour un web qui prenne du sens et perde du poids ! Entrons dans le vif du sujet en précisant rapidement de quoi il s’agit : →