28172 sujets

CSS et mise en forme, CSS3

Bonjour,
J'ai une petite question à poser par rapport au CSS, et je n'ai malheureusement pas trouvé de réponse sur le web. J'ai vu ce topic: http://forum.alsacreations.com/topic-4-18115-1-Resolu-Text-decoration-imbriques.html sans trouver de solution (mais j'ai peut-être mal compris des trucs).

En fait, en gros, j'ai quelque chose comme ça:
<span style="text-decoration:underline">Je suis <span style="text-decoration:none;">un texte</span>.</span>

Le problème, c'est que le "underline" est quand même appliqué dans le span où text-decoration est à none. En fait, pas moyen d'enlever ce style dans les noeuds enfants. Par contre, évidemment, pour font-weight, ou font-style par exemple, ça marche sans problème.

Sachant que le problème reste le même si les text-decoration sont déclarés dans des feuilles de style externes, à travers de classes, et pareil avec l'utilisation de !important.

Ce que je voudrais éviter grandement, c'est d'avoir à splitté le span en gros, je voudrais ne pas avoir besoin de faire un truc comme ça: <span style="text-decoration:underline;">Je suis</span>un texte<span style="text-decoration:underline;">.</span>

Merci d'avance!
Modérateur
Bonjour,

C'est une question intéressante.

Une remarque : en règle générale, on évite de souligner des mots qui ne sont pas des liens.

Je serais curieux de savoir pourquoi tu veux absolument imbriquer les spans.

Serait-il possible d'avoir un exemple du visuel que tu veux obtenir avec du contenu réaliste?

Edit : J'avais proposé une bidouille horrible, mais apparemment ça ne fonctionne pas partout. Alors j'ai supprimé avant de regretter d'avoir fait une telle suggestion. Smiley biggol
Modifié par Tony Monast (10 May 2011 - 18:11)
Salut,
Merci pour cette réponse!

En fait, j'arrive à cette situation dans un éditeur pour le html que je suis en train de développer (du genre ckeditor), pour pouvoir éditer des pages statiques. J'ai voulu éviter d'utiliser systématiquement <em> et <strong> du coup j'ai pensé à des spans. (en suivant, outre mon idée, les recommandations à la fin de cet article: http://www.alsacreations.com/article/lire/552-strong-b-em-i-quelle-balise-utiliser-et-pourquoi.html )

J'ai codé le script de la manière la plus simple qu'il me semblait, et je me retrouve donc avec parfois des spans imbriqués quand l'utilisateur veut mettre un morceau de texte dans une page html par exemple en gras et qu'à l'intérieur il se retrouve à vouloir supprimer la mise en gras sur un seul mot, par exemple (pour anticiper tous les cas de figure).

Pour le gras, l'italique, et la couleur de police, pas de problème, seul le souligné bug. D'ailleurs, si à la place de none, dans le span intérieur, on met overline, on se retrouve avec du texte qui a simultanément underline et overline... Ca m'aide pas mais c'est fun Smiley smile

Mais il semble que je vais devoir reprendre le script pour juxtaposer différents span au lieu de les imbriqués, (mais ça implique, supprimer le premier span en souligné, en rajouter un avant la sélection, en rajouter un autour de la sélection qui ne sera pas souligné, mais éventuellement avec les autres styles qui s'appliquaient, et encore un après la sélection, en souligné, le tout en tenant compte du fait que ces spans vont peut-être chevaucher d'autres balises, etc., puisque l'édition dépend de l'utilisateur et pas de moi).

Bref, c'est pour ça que je voulais éviter... Smiley biggrin

Malheureusement, ces pages ne sont qu'en local actuellement.

Merci d'avances pour d'éventuelles futures réponses Smiley smile
Modérateur
Bonsoir,

Malheureusement, j'ai bien l'impression que tu ne pourras pas imbriquer les spans. J'ai jeté un oeil au démo de TinyMCE et de son côté, il sépare bien les spans pour éviter les imbrications. Je pense bien que tu n'auras pas le choix.
Et bien merci pour ces réponses Smiley smile
Je vais donc y travailler... avec une pointe de déception Smiley smile