Bonjour Elenkan et bienvenue sur le forum Alsacréations.
Elenkan a écrit :
Je voudrais aligner des liens du type :
News
Forum
Contact
etc ...
sur les cases de cette image :
Très mauvaise idée. Ceci impliquerait un texte ne pouvant pas être redimensionné ce qui irait à l'encontre des recommandations en matière d'accessibilité.
Directives pour l'accessibilité aux contenus Web (version 1.0) a écrit :
3.4 Utilisez des unités relatives plutôt qu'absolues dans les valeurs des attributs du langage de balises et dans les valeurs des propriétés des feuilles de styles.
http://www.la-grange.net/w3c/wcag1/full-checklist.html
En fait, le but de CSS n'est pas d'adapter un contenu à une présentation, mais bien l'inverse : séparation du contenu et de la présentation.
L'idéal serait de regrouper tes liens sous forme de liste :
<ul id="menu">
<li><a href="#">News</a></li>
<li><a href="#">Forum</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">etc ...</a></li>
</ul>
Et via CSS, déclarer un background pour chaque <li> :
#menu ul li {
background-image: url(images/mon-joli-gradient.gif) no-repeat 50% 50%;
}
En ayant une image suffisamment grande, celle-ci devrait pouvoir s'adapter à un texte de toutes tailles. La déclaration 50% 50% positionne le background « dead centre »
Pour en savoir plus sur les propriétés d'arrière-plan :
http://www.yoyodesign.org/doc/w3c/css2/colors.html#q2
<edit />
J'oubliais ce liens :
http://openweb.eu.org/articles/background_css/ Modifié par Stephan (28 Mar 2005 - 07:07)