Delirium Tremens a écrit:
Ca revient au même que 2 images, je trouve ça même plus simple d'avoir 2 images, on a pas géré le positionnement du background et à bien positionner chaque image à égale distance. Cela dit pour des barres de menu avec icônes ça peut être pratique...
Je corrige les bêtises que je dis, la technique des sprites a un avantage au niveau "rapidité", un navigateur met moins de temps à charger une seule grosse image que plusieurs petites. Surtout qu'un navigateur est limité au niveau des téléchargements parallèles par domaine (du coup si vous avez beaucoup de téléchargements parallèles (js, css, images...) pour une même page, il est préconisé d'utiliser des sous-domaines pour tromper le navigateur). Les sprites CSS devraient donc améliorer la vitesse et le référencement du coup (je les utilise pour un nouveau site, verdict dans quelques semaines, mais bon ajouter à d'autres techniques : CSS et JS compressés (bon ça c'était déjà le cas, mais le système de compression va changer), sprites, caches différés, stats en js au lieu de php, bannières pubs appelées en fin de page... ce sera donc difficile de savoir ce qui améliore le plus la vitesse du site, par contre j'attends de voir le ref, même si le site change aussi donc dur de comparer, faudrait faire ça sur un site sans rien toucher au design et aux balises).
Sinon petite astuce pour mettre du texte à la verticale (pas les lettres sous les autres, juste comme si on avait tourné une div à 90°) :
Citation:
-webkit-transform:rotate(-90deg);-moz-transform:rotate(-90deg);-o-transform: rotate(-90deg);filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
Comme d'hab, IE en fait qu'à sa tête, mais sinon ça commence à me gonfler aussi de devoir préciser à chaque fois le nav (webkit, moz, o et ie) dans les options css récentes. Le rendu est pas terrible sous IE tel quel, il faut mettre un background de la couleur du fond, pour ne pas que la police bave.
Source :
http://snook.ca/archives/html_and_css/css-text-rotation