Loupilo
lundi 12 juin 2006 à 13:10
Dudu a tout à fait raison quand il évoque l'impossibilité d'additionner des unités différentes... C'est un obstacle
majeur à l'utilisation des CSS, et aux maquettes souples.
Un autre des problèmes importants de l'interpretation des CSS rendant leur utilisation difficile pour les sites étirables, c'est le
modèle de boîtes de Microsoft. Non pas qu'il me gène, au contraire : je trouve que c'est le seul valable et qu'il devrait être celui de tous les navigateurs. Oui, je pense sincèrement que cette vision des dimensions CSS est bien plus interessante et bien plus pratique dans la conception de feuilles de style... et c'est regrettable qu'elle ne soit pas utilisable puisque limité à Internet Explorer quand il est en transe.
Prenons un cas de figure simpliste : une boîte destinée à occuper 100% (largeur) de l'écran, avec des marges internes (padding) de 15px. Pas 1%, car la taille du % varie bien trop en fonction de la résolution (en plein écran : 1%=8 pixels en 800*600, 16 en 1600*1200), pas 1em, qui serait susceptible de varier, mais bien 15px, fixes. Le résultat est tout aussi simple que l'énoncé, c'est
impossible. La boite fera 100% de largeur + 30px. Votre bloc dépassera la zone de visualisation... Vous devrez vous rabattre sur le padding en % aux résultats variés. Avec IE en modèle de boites MS, votre bloc fera 100%-30px+30px de marges internes. Soit 100% en tout et pour tout... Le résultat escompté, en somme. Et logiquement, la zone de visualisation sera réduite à 100%-30px.
Sans même meler les unités, vous devrez attribuer une taille de 480 pixels à un bloc destiné en faire 500 avec une marge interne de 10 pixels. Et vous pourrez dire adieu à vos 500 pixels bien déterminés si vous comptez mettre le padding en em !
Bref, c'est un vrai casse-tête qui bride vraiment les possibilités. Bien sûr, on peut contourner certaines difficultés, mais l'implémentation des CSS dans la majorité des navigateurs ne permet pas de réaliser ce qu'on serait en droit d'attendre d'un langage se prétendant être la solution ultime de stylisation des pages Web...
Le max-width est indispensable, et le hack permettant de l'émuler sous IE (win) fonctionne très bien, ce n'est donc pas ça qui me fait douter des CSS pour les maquettes étirables... c'est le reste.