28173 sujets

CSS et mise en forme, CSS3

Bonjour

Je me suis mis à créer mon petit site il y a quelques semaines, en gros c'est un FTP relooké avec un fichier htaccess. Je voulais ajouter un menu, j'en ai trouvé un sur ce site et l'ai adapté avec NVU :

Modèle:
http://css.alsacreations.com/modelesmenus/g06.htm

Ma page est ici :
http://lemaitrevince.free.fr/accueil.html

J'ai presque réussi mais je rencontre encore un soucis : les liens n'apparaissent pas dans l'image inversée (dans l'exemple d'alsacréations c'est lien, lien1, lien2, lien3).
Est-ce un problème de couleur dans le code (pourtant je crois que j'ai tout mis en noir) ou faut-il incruster les noms des liens dans l'image inversée avec photoshop ou autre? :o

Sinon je n'ai pas encore touché à la partie du code plaçé sous la balise "div#mentions {" et je pense que ça vient de là mais je n'ai aucune idée des valeurs à changer pour que ça rende sur ma page.

Merci beaucoup de prendre le temps et si vous avez une idée n'hésitez pas. Perso, je préfererai ne pas devoir toucher à l'image et faire apparaître les titres via le html comme ça si un jour je découpe l'image en plus de quatre parties (et ça va arriver c'est sûr) je pourrais garder les mêmes bases.
Modifié par xvinz (03 Mar 2008 - 00:35)
Bonjour,

Dans l'exemple que tu as copié-collé sans comprendre:
- le texte des liens est caché via un text-indent: -5000px;
- le texte qui s'affiche pour l'état survolé est intégré à l'image de fond de cet état;
- div#mentions correspond à un contenu qui n'existe pas dans ta page.
Merci pour tes explications, c'est vrai que j'apprends sur le tas sans forcément tout comprendre d'un coup... Smiley cligne

Si j'ai bien compris il faut que j'incruste les titres de mes liens dans l'image de fond avec un éditeur.

J'ai essayé de mettre le texte-indent:0px et effectivement les chemins des liens apparaissent (un truc de plus de pigé).

Je vais supprimer le code inutile.

Je vous dis quand c'est bon Smiley biggrin
Modifié par xvinz (28 Feb 2008 - 18:29)
Voilà j'ai inséré les titres dans l'image de fond et ils apparaîssent correctement. Smiley biggrin
Par contre au niveau de l'affichage de la page c'est pas encore ça. L'image est trop haute et trop large du coup il y a des barres de défilement verticale et horyzontale. C'est mieux en plein écran mais je peux pas forcer mes visiteurs à activer ce mode... Est-ce qu'en faisant des rectangles plus petits et en rabotant en conséquence mon image je peux m'en sortir? Si oui avec quelle résolution?

Sinon dans les pages gérées par le HEADER.html et htaccess il y a encore trop de largeur et donc une barre de défilement horyzontale. Pensez-vous que ça marche si je rabote mon image en largeur?

Merci d'avoir lu et si vous avez des suggestions n'hésitez pas Smiley cligne
Modifié par xvinz (28 Feb 2008 - 20:07)
Administrateur
Bonjour,

je ne vois pas de barres de défilement, dans ce cas j'imagine que le sujet est [Résolu]? Merci de l'indiquer si c'est le cas ou bien dis-nous ce qu'il manque pour que tout soit parfait Smiley cligne
Je n'ai pas encore trouvé de solution, la taille des 4 carrés fait qu'il y a toujours une barre verticale, pour l'instant j'ai laissé tel quel c'est à peu prêt fonctionnel, il faut juste scroller Smiley cligne

Merci beaucoup pour vos conseils Smiley biggrin