CSS - problema con div absoluto

Hola,

tengo un problema con unos divs. A ver si me podéis ayudar. La cuestión es la siguiente:

tengo un div bien sencillo:

<div style="position: absolute; background-color: red">
<div style="position: relative; ">Texto de demostración</div>
</div>

Donde el background se dibuja solo donde encontramos texto. Ahora quiero darle un height al div interior, de manera que tengo:

<div style="position: absolute; background-color: red; top:50px">
<div style="position: relative; height:20px">Texto de demostración</div>
</div>

El problema es que ahora en explorer me dibuja el background con un width de 100%, y yo quiero que siga dibujandose solo encima del texto.
La idea es que el texto será dinámico, por lo que desconozco el width que va a tener el div. Así que no puedo asignar ningún width.

Para ver el problema podéis añadir los dos ejemplos en un html y veréis a que me refiero.

Alguna sugerencia?

Gracias