Petite question sur l'utilisation d':after et de content

Salut,

En lisant le bouquin de l'hôte de ce lieu et en parcourant le standblog, j'ai commencé à vouloir moi aussi utiliser le pseudo élément :after pour rajouter à la fin des liens la langue (voir par exemple http://standblog.org/blog/post/2012/02/29/Actu-Mozilla-B2G ).

Et là le drame s'est produit.
Si nos liens possèdent le style par défaut, (text-decoration: underline), l'underline est forcément présent en dessous du contenu rajouté dans le content du pseudo élément :after.
Voir par exemple :

    <ul>
        <li><a href="http://www.google.fr/" hreflang="fr">mon lien avec attribut hreflang fr</a> le contenu [fr] sera rajouté mais en souligné:/</li>
        <li><a href="http://www.google.fr/" >mon lien sans attribut lang</a> rien ne sera rajouté</li>
        <li><a href="http://www.google.com/" hreflang="en">mon lien avec attribut hreflang en</a> le contenu [en] sera rajouté mais en souligné:/</li>
  </ul>

a[hreflang]:after{
    color:#000;
    content: '[' attr(hreflang) ']';
    text-decoration: none;
}

Je n'aime pas enlever le text-decoration des liens car j'aime pouvoir les identifier facilement mais je ne vois pas comment faire autrement:/

Si une bonne âme sait comment pouvoir régler ce problème!

Petit point bonus, mais là je rêve largement, attr(lang) contient la langue d'un élément, si l'on veut rajouter une petite déco par exemple un drapeau en arrière plan on fait par exemple :

element[lang=fr] {
background: url ('img/fr.png');
}

Sauf que je suis feignant et je me disais que faire un truc du genre

element[lang] {
background: url('img/' attr(lang) '.png');
}

ca aurait été noël! mais on dirait que ce n'est pas possible:/

Merci d'avance!

Hello,

a écrit :
si l'on veut rajouter une petite déco par exemple un drapeau en arrière plan on fait par exemple

En fait oui mais non, car un drapeau / pays n'est pas une langue.
Quelle est la langue de la Belgique ?
Comment dire aux Thibétains qu'ils ne sont pas Chinois ?
Etc.

Regarde pour t'inspirer comment font les sites multilingues "officiel", par exemple le Conseil de l'Europe : http://www.coe.int

Salut,

Merci pour ta réponse!
Je n'avais pas pensé à ce détail qui enlève pas mal de crédit à cette technique.

J'aurai du dire "on pourrait faire" et non pas "on fait" mais pour ma défense je l'ai repris de ton (excellent) bouquin à la page 42 (pourtant c'est La réponse à l'ultime question!).

Une solution serait peut être d'utiliser "fr_FR" à la place de "fr" ?

Par contre, je n'ai pas réussi à régler le point sur l'underline du contenu ajouter après le texte du lien.
Un collègue a bien trouvé une façon de ne plus l'avoir mais en utilisant un positionnement absolu, ce qui est sacrément gênant!
En fait, je voudrais surtout savoir pourquoi cela réagi de cette façon.

Idem pour le fait de pouvoir utiliser attr(hreflang) dans une url, ca aurait été vraiment classe!:p Mais là je conçois que c'est un peu tiré par les cheveux!