Dialogues en français et en CSS

Des livres incontournables pour tout maîtriser

Auteur
David Latapie	# 06 Dec 2009, 22:57:46
1+1=3 70 Posts	Bonjour, Voici ce que je veux faire : « Bonjour, comment allez-vous ? – Bonjour. Très bien, et vous ? Très bien, merci. » (tiret cadratin et espace insécable) Voici le code que j'ai composé <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Dialogue de Q</title> <style type="text/css"> #dialogue {list-style:none} #dialogue q {quotes : '« ' ' »' "'" "'"} #dialogue li:first-child q:before {content:open-quote} #dialogue li:first-child q:after {content:no-close-quote} #dialogue li:before q {content:no-open-quote} #dialogue li:after q {content:no-close-quote} #dialogue li:last-child q:before {content:no-open-quote} #dialogue li:last-child q:after {content:close-quote} </style> </head> <body> <ul id="dialogue"> <li><q>Bonjour, comment allez-vous ?</q></li> <li><q>Bonjour. Très bien, et vous ?<q></li> <li><q>Très bien, merci.</q></li> </ul> </body> </html> Opera 10 me donne un résultat presque parfait. Firefox 3.5 donne du gros n'importe quoi. J'aurais tendance à penser qu'Opera à raison (sa réputation pour le respect des standards n'est plus à faire). Cependant, je ne sais toujours pas comment intégrer le tiret cadratin. En effet, la spécification CSS n'inclut pas les guillemets de début de continuité (ici, le tiret cadratin). Je pensais m'en sortir avec `#dialogue li:before q {content:"– "}` Mais ça ne fonctionne pas. Que faire ? Question subsidiaire : j'ai l'impression que la seule raison pour laquelle on s'embête avec les valeurs de `quote` , on lieu de simplement mettre du `content:"bla"` , c'est la guestion de citations imbriquées. Me trompé-je ? Merci </david_latapie>
1+1=3 70 Posts
Heyoan	# 06 Dec 2009, 23:16:52
Modérateur 8101 Posts	Hello David, je dirais que FF s'en sortirait mieux en fermant bien la seconde citation avec </q> plutôt qu'avec <q> Éléments html, hiérarchie XHTML 1.0 Strict et propriétés CSS
Modérateur 8101 Posts
Heyoan	# 06 Dec 2009, 23:29:44
Modérateur 8101 Posts	David Latapie a écrit : j'ai l'impression que la seule raison pour laquelle on s'embête avec les valeurs de `quote` , on lieu de simplement mettre du `content:"bla"` , c'est la guestion de citations imbriquées. Me trompé-je ? Je suppose qu'il faut remplacer "on lieu de" par "au lieu de"... mais je ne comprends toujours pas la question... Éléments html, hiérarchie XHTML 1.0 Strict et propriétés CSS
Modérateur 8101 Posts
David Latapie	# 07 Dec 2009, 00:30:01
1+1=3 70 Posts	Merci de tes remarques. Je n'arrive pas à trouver le bouton pour éditer les messages. Pour le code, maintenant que je ne suis malheureusement plus sur Mac, je n'ai plus mon brave BBEdit avec son valdateur intégré (toujours imité, jamais égalé), donc je valide rarement en ligne. Ceci étant dit, le comportement reste imparfait même avec la balise correctement fermée </david_latapie>
1+1=3 70 Posts
gc-nomade	# 07 Dec 2009, 00:58:41
gcyrillus en mode portable 911 Posts	bonjour, pour inserer des caracteres speciaux au travers de la regle content , il faut se servir de leur code hexadecimal. je te propose cette correction avec \2014 ou \2012 (pas sur quelle passe partout OS/navigateurs ) : `#dialogue {list-style:none;} #dialogue q {quotes : '« ' ' »' "'" "'"} #dialogue li:first-child q:before {content:open-quote;} #dialogue li:first-child q:after {content:no-close-quote} #dialogue li q:before {content:no-open-quote'\2012';padding-right:0.5em;} #dialogue li q:after {content:no-close-quote} #dialogue li:last-child q:before {content:no-open-quote'\2012';} #dialogue li:last-child q:after {content:close-quote;}` sinon , tout simplement inserer le tiret comme un signe 'négatif ' `#dialogue {list-style:none;} #dialogue q {quotes : '« ' ' »' "'" "'"} #dialogue li:first-child q:before {content:open-quote;} #dialogue li:first-child q:after {content:no-close-quote} #dialogue li q:before {content:no-open-quote'-';padding-right:0.5em;} #dialogue li q:after {content:no-close-quote} #dialogue li:last-child q:before {content:no-open-quote'-';} #dialogue li:last-child q:after {content:close-quote;}` <edit> un lien utile pour retrouver le code d'un caractere : http://slayeroffice.com/tools/unicode_lookup/ </edit> Modifié par gc-nomade (07 Dec 2009 - 01:08) GC rien , mais GC encore ...
gcyrillus en mode portable 911 Posts