28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Dans mon titre H1,
<h1 class="identite">Identi<del>té</del>que</h1>


Mon CSS

.identite {
font-size: 2em;
font-weight: 100;
font-style: italic;
line-height: 0;}


Sur Safari (desktop et mobile), j'ai le trait parfaitement fin à l'image du font-weight de mon H1

Dès lors que je passe sur Firefox desktop et mobile et Chrome, j'ai une grosse barre horizontale bien moche.

<del> hérite-il le style de <h1> ? Si ce n'est pas le cas, je n'ai pas trouvé d'info sur le style à appliquer.

j'ai essayé avec text-decoration: line-through dans un span mais c'est toujours aussi dégeulasse.
Bonjour,

Tu ne peux pas régler l'épaisseur du trait de <del> ou de propriétés de type text-decoration.

Le seul moyen est donc de mettre une image en background.
pour de petite portion de texte qui tiennent sur une ligne , tu peut un reset sur text-decoration et ajouter une bordure basse dont tu maitrise l'epaisseur pixel par pixel et que tu repositionne avec un line-height entre 0.1em et 0.3em;
del {
  line-height:0.2em;
  text-decoration:none;
  border-bottom:1px solid;
  display:inline-block;/* okay tant que ça tient sur une ligne, c'est une boite maintenant dont chaque ligne aura une hauteur de 0.2em */
}

http://codepen.io/anon/pen/bIKpB/
Modifié par gc-nomade (08 Apr 2014 - 03:07)
Hello,

Encore une fois, c'est une quête vaine et perdue d'avance que de vouloir reproduire un site qui soit, au pixel près, l'exacte copie de ce que l'on a imaginé, sur tout les navigateurs du marché (et ils sont nombreux les bougres !)
Il faut savoir lâcher prise et accepter ces petites différences Smiley cligne
6l20 a écrit :
Hello,

Encore une fois, c'est une quête vaine et perdue d'avance que de vouloir reproduire un site qui soit, au pixel près, l'exacte copie de ce que l'on a imaginé, sur tout les navigateurs du marché (et ils sont nombreux les bougres !)
Il faut savoir lâcher prise et accepter ces petites différences Smiley cligne


je suis d'accord bien sur, en l'occurance il s'agit d'une epaisseur de trait qui peut pour le coup prendre une couleur différente que le texte exemple http://codepen.io/gcyrillus/pen/Dihrv 'où la proposition de la methode Smiley smile
Modifié par gc-nomade (08 Apr 2014 - 12:57)
@gc-nomade : La remarque ne s'adressait pas vraiment à toi Smiley cligne

ps : sympa ta petite bidouille, mais on perd la "sémantique" de l'élément del, non ?