隐藏SPAN溢出

Question

我正在尝试创建一个组合框样式小部件(jquery-ui兼容),目前我正在尝试将盒子的静态布局排序.问题是当我在选择的值区域中有长文本时它不会在Firefox中剪辑(它实际上是包装).我不想要这个,并尝试了各种组合溢出:隐藏的白色空间:nowrap等,但在Firefox中它仍然包装.示例代码如下.

<a href="#" class="ui-widget ui-widget-content ui-custom-button ui-state-default ui-corner-all ui-helper-reset" style="padding-left:5px;text-decoration: none; width: 139px; ">
    <span style="float:right;margin-top:1px;border-left:1px solid #D3D3D3;" class="ui-custom-button-icon ui-icon ui-icon-triangle-1-s" ></span>
    <span style="line-height:1.5em;font-size:10px;margin-top:1px;overflow:hidden;height:16px;">If the text is very long then somethin</span>
</a>

任何人都可以提供任何帮助吗？

Answer 1

尝试给出元素a display:block,或者将其更改SPAN为块级元素DIV.

Answer 2

问题是跨度是内联元素,您不能在内联元素上设置宽度或高度.

由于溢出控件基于块尺寸,因此不起作用.

但是,从Firefox 3.0开始,就有支持

  display: inline-block

它允许你控制元素,就好像它是一个块,而是包含范围内仍表现得像一个内联元素.