Etiqueta de texto al lado del control deslizante jQuery UI

Question

Dentro de un elemento primario div, quiero tener una etiqueta de texto a la izquierda y un control deslizante (usando jQuery UI) a la derecha. Deseo que el control deslizante ocupe todo el espacio disponible.

Así conceptualmente lo que voy a mirar es:

<div id="parentDiv" style="width:800px"> 
<span>Unicorn awesomeness:</span><div id="unicornSlider"></div> 
</div> 

pero no puedo conseguir nada fácil que funciona en Chrome, FF3 & IE7/8. ¿Hay una solución relativamente limpia? Me conformaré con hacer que el control deslizante sea de un ancho fijo si hace las cosas más fáciles, aunque esto no sea lo ideal.

Answer 1

creo que sería mucho más difícil de conseguir su efecto en línea sin especificar un ancho de

He aquí un ejemplo con una anchura% que funciona en los navegadores antes mencionados (IE7 era un poco fuera del centro de la guarnición la etiqueta y el deslizador pero todavía estaba en la misma línea)

http://jsfiddle.net/pxfunc/D7b7F/

#unicornSlider {float:right;width:80%;}