jQuery UI滑块旁边的文本标签

Question

在父div中,我想在左边有一个文本标签,在右边有一个滑块(使用jQuery UI).我希望滑块占用所有可用空间.

从概念上讲,我将看到的是:

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

但是我无法轻易获得适用于Chrome,FF3和IE7/8的任何功能.有一个相对简洁的解决方案吗？如果它可以使滑块变得更加容易,我会尽力使滑块成为固定的宽度,即使这并不理想.

Answer 1

我认为在没有指定宽度的情况下获得内联效果要困难得多

这是一个使用%宽度的例子,在上面提到的浏览器中工作(IE7在排列标签和滑块方面有点偏离中心,但它仍然在同一条线上)

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

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