28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

Bidouillant la version imprimable de mon site, je cherche comment rendre "focused", "active", ou "hovered" un lien pour l'impression.

Je m'explique : le lien contient un span, qui s'affiche (perd son display:none) au survol de la souris, au focus, ou en devenant actif...

En gros, j'ai ça :
html>body #info a span {  
  display: none;}


et ça :
html>body #info a:focus span, #info a:active span, #info a:hover span {  
  display: inline;}


Et je voudrais que le contenu du span soit imprimé (et donc "displayed")...

Mais après moult essais et recherches, yé né trouve pas Smiley confus

Quelqu'un aurait une idée ?

Merci infiniment.

Pierre

(edit : erreur de copier-coller du code Smiley rolleyes )

(edit bis : la soluce serait peut-être de remplacer les "display" par des "visible", mais j'ai peur que cela ne change ma disposition... Smiley sweatdrop )
Modifié par horse_pyro (07 Aug 2007 - 15:48)
Bonjour,

Si de ta css print tu élimines:
html>body #info a span {  
  display: none;}

html>body #info a:focus span, #info a:active span, #info a:hover span {  
  display: inline;}

que tu remplaces par

html>body #info a span {  
  display: inline;}


Non?
Salut,

Euh...

En fait, pour la version normale (online, navigateurs, ... on l'appele comme on veut), le contenu du lien doit rester invisible tant que l'utilisateur n'a pas fait la "démarche" de le rendre visible.

En fait, il contient des informations complémentaires, que le visiteur peut afficher si besoin est.
(Je suis resté en css et ai évité de mettre du javascript pour éviter le problème du "j'ai pas JS, ou je l'ai désactivé")
Ben la solution de ghost me semble tout à fait correcte, non?

Si le mécanisme de lien caché/affiché doit s'appliquer uniquement au rendu sur écran, je suppose qu'il est bien dans une feuille de style pour le média screen? Du coup, il se s'applique pas pour le print, et le lien est bien imprimé.

Si on a un peu mélangé les choses dans une feuille de style «globale» qui s'applique à tous les médias (media="all" ou pas d'indication de média), il faudra alors contredire dans la CSS print la déclaration présente dans la CSS globale:
html>body #info a span {display: inline;}