Comment faire un élément de bloc s'adapter à la taille de ce qui est à l'intérieur?

Si j'ai ce code HTML:

<li class="name">hi</li>
<li class="name">hello</li>
<li class="name">wheeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee!</li> 

Et ce CSS:

li.name{
    border: 1px solid #A38870;
    background-color: #FA682D;
    list-style: none;
    margin: 15px;
    padding: 5px;
}

L'arrière-plan s'étend tout le chemin à travers la page comme cette.

Comment puis-je rendre l'arrière-plan s'adapter à la taille du texte comme cette (sans définition explicite de la largeur de chaque élément de la liste)?

Halma Oui, je vous remercie. J'attendais de voir si quelqu'un aurait des commentaires pour m'aider à comprendre si votre solution ou Usman Ali est préférable.

OriginalL'auteur pennydrops | 2011-04-27