28173 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai un souci avec un menu. C'est en menu en CSS qui lit des images en background (avec les différents états).

voici un exemple du code HTML :


<ul>
<li id="item2"><a href="#" title="actualités" >actualités</a></li>
<li id="item3"><a href="" title="l'agence" >l'agence</a></li>
<li id="item4" class="active last"><a href="" title="nos réalisations" >nos réalisations</a></li>
</ul>


Mon problème est le suivant, je n'arrive pas à faire disparaitre le texte à l'intérieur des balises <a> (actualités, l'agence, nos réalisations)

Il faut que j'y arrive sans passer par un span avec une valeur display à none (comme je le vais pour un autre bouton "accueil".

La page est visible ici :

http://www.meridian-communication.com/beug/beug.html

la feuille CSS ici :

http://www.meridian-communication.com/beug/site-beug.css

Merci pour votre aide...

Jean-guy
Modifié par jean-guy (02 Apr 2007 - 19:51)
Bonjour,
alors peut-être masquer les liens qui se trouvent à l'intèrieur des <li>

li a {display:none}
salut,
et des liens vides ? comme tes titles sont renseignés ils restent accessibles et tu peux leur attribuer des dimensions height et width, voire en passant par un display: block, comme ça le fond reste visible...

bidouille mais bon, ça ou un span en display:none, à la limite je ne sais pas ce qui est le mieux du point de vue de la théorie Smiley smile

have swing
pareil pour visibility:hidden...

ne rien mettre ds les liens, meme avec une balise title, n'est pas conseillé, ca enleve tout sens à la liste
Alors je crois que tu sois un peu plus clair sur ce que tu veux faire.
Modifié par Hermann (02 Apr 2007 - 22:19)
ma demande est claire, je veux arriver à afficher une menu en image sans pour antant voir afficher le texte entre les balises <a>

c'est possible, mais je ne vois pas ou est mon erreur
Salut,

jean-guy a écrit :

je veux arriver à afficher une menu en image...

... c'est possible, mais je ne vois pas ou est mon erreur


Vouloir faire un menu en image je pense Smiley cligne

Ou tout simplement trop vouloir, ce qui est le syndrôme no1 des développeurs web en général Smiley lol
Modifié par Christian Le Bouler (02 Apr 2007 - 22:34)
jean-guy a écrit :
un "text-indent: -5000px" et le tour est joué...

On rappellera juste que cette solution n'est que partiellement satisfaisante du point de vue de l'accessibilité. La solution la plus convaincante étant l'emploi d'images HTML (balise <img>) avec texte alternatif pertinent (et effets de survol en Javascript, si on souhaite de tels effets).
je ne vois pas en quoi cette solution n'est que partiellement satisfaisante du point de vue de l'accessibilité. Si tu peux expliquer un peu plus en détail pourquoi?

J'utilise la feuille de style pour arriver à l'affichage que je veux, sans que le code HTML ne bouge...

Au contraire, ajouter une image sans CSS qui de toute evidance n'est que pour de l'affichage (qui en plus doit passer par du javscript pour arriver au meme résultat), je ne vois pas très bien ou est cette solution la plus convaincante.
Bonjour,

D'accord donc tu peux oublier les méthode que je t'ai donné plus haut,
elle sont toutes mauvaises. Smiley confused

Elle n'est que partiellement accessible car si les images sont désactivées
ou non chargée pour une raison ou une autre, rien ne s'affichera.
Pour cette raison, quand on doit mettre en place une image texte,
la méthode la plus sure est d'utiliser des images dans le html avec
le alt bien sûr.
D'autre part si tu restes sur cette méthode, il vaut mieux déclarer

{position:absolute;  top: -500px}

Le text-indent pause un problème de zone cliquable il me semble
mais à confirmer.

Un alternative possible si tu veux conserver le roll-over consiste
à ajouter une image de 1px/1px transparente auquel tu donnes la taille
de ton image de fond sans oublier le alt, mais EN PLUS des
autres techniques citées plus haut. Vérifier si le texte s'affiche
correctement une fois CSS désactivée.
Modifié par Hermann (03 Apr 2007 - 12:16)
Sisi, j'ai bien vu t'as réponse, merci...


Pour l'instant le text-indent ne m'a pas posé de probleme pourles zne cliquable

merci pour ces précisions
jean-guy a écrit :

merci le bouler, pour les encouragement de trop vouloir en faire


Aucun problème, tu n'es ni le premier ni le dernier. Il faut dire que le syndrôme est particulièrement pregnant.

Laurent Denis a plusieur fois fait la remarque "assumez vos choix"...

...

Ouais ben moi je me permet de rajouter "Et avant interrogez vos pratiques"...

Mais bon sans rancune comme on dit Smiley cligne

PS : j'aime beaucoup la connotation que rajoute le fait de répondre à quelqu'un sous son nom alors que le prénom est donné...

... ça vous a un petit air glacial et insultant tout à fait réussi sans avoir l'air d'y toucher.

En plus ça permet toutes les dénégations ensuite Smiley langue
Modifié par Christian Le Bouler (04 Apr 2007 - 13:41)
virtualgadjo a écrit :
comme tes titles sont renseignés ils restent accessibles

Non, pas vraiment. Les titles seront lus par certains lecteurs d'écran avec certaines préférences configurées, mais pas par d'autres. De plus, il n'y a pas que les aveugles parmi les publics concernés par l'accessibilité, hein. Smiley cligne