Background qui "suit" le texte

Bonjour,
J'ai eu beau chercher un peu partout, je ne trouve pas de moyen de faire un background qui "suive" le texte avec CSS. Comme avec des mots ce n'est pas très claire, je mets une image...
Si c'est possible, ça serait vraiment super...

Merci pour votre aide.

Salut,

Bah
HTML:

<p> lorem ipsum...</p>

CSS:

p{background:black; color white;}

Modifié par jmlapam (02 Feb 2012 - 02:42)

non cela ne correspondra pas.
Il n'y a pas de solution simple, qui ne passe pas par l'ajout de balises multiples

<p><span class="surligne">Cum autem commodis intervallata temporibus convivia longa et noxia coeperint apparari vel distributio sollemnium sportularum, anxia<br> deliberatione tractatur an exceptis his quibus vicissitudo debetur, peregrinum invitari conveniet, et si digesto<br> plene consilio id placuerit fieri, is adhibetur qui pro domibus excubat<br> aurigarum aut artem tesserariam profitetur aut secretiora quaedam se nosse confingit.</span></p>

.surligne{
  background-color: black;
  color: white;
  padding: 1px;
}

Rendu :

Modifié par Gothor (02 Feb 2012 - 13:22)

avec un span, au temps pour moi

Super les gars ! Merci beaucoup, vous êtes les meilleurs !

À noter que les possibilités graphiques sont limitées. Par exemple on ne peut pas jouer sur le padding-left ou padding-right pour éviter que le texte soit collé aux bords du surlignage. Il faudrait pour cela avoir accès en CSS aux inline boxes générées par le navigateur (soit 4 pseudo-éléments dans l'exemple donné par Gothor), et à ma connaissance ce n'est pas possible.

Toutefois, appliqué sur un seul mot, pour peu qu'il ne soit pas coupé en plein milieu, l'utilisation du padding permettra de dégager un peu les bords du texte. Mais sur plusieurs lignes, son usage reste délicat.

Oui, c'est dommage pour le padding... mais bon j'aime bien quand même comme ça. Vous pensez que ça sera jamais possible ? ou peut être un jour ?