html - 如何防止最右边的内联元素在 CSS 中换行或溢出？

Question

我放弃！

这是我要完成的工作：

小提琴：http: //jsfiddle.net/Ws5Ts/1/

期望的行为：

1. 指标编号与客户姓名内联显示（我不希望它固定在itemdiv 的右侧）
2. item当窗口调整大小或客户的姓名很长时，指示器不应溢出，而是在客户姓名溢出时停留在 div的右侧

在过去的两个小时里，我一直在尝试使用divs具有不同定位的所有不同类型的包装，但我无法让任何东西完全按照我想要的方式工作。

谢谢！

Answer 1

好的，我在这上面花了太多时间。

可能的解决方案：http : //jsfiddle.net/Ws5Ts/17/

方法：

1. 反转文本和指示器的顺序，然后切换direction到rtl，使文本向左溢出。这使指示器保持在我想要的位置，但文本现在朝错误的方向溢出。
2. 隐藏溢出的文本并将其用作分隔符。在具有边距的容器中设置重复的可见绝对定位文本以说明指示器，并在该容器上设置 nowrap、隐藏溢出和文本溢出。

这似乎适用于 Chrome、Firefox、Safari 和 IE9。

还有其他人有不那么复杂的方法吗？

Answer 2

将指标放在当前 div 之外怎么样？只是做了一个非常简单的例子来说明我的意思：http: //jsfiddle.net/Ws5Ts/3/

我的课表现不是很正确，但我要睡觉了:)

'

编辑：如果更适合您的布局，请参阅我关于 margin-left 的评论