1

我有以下情况：

<div style="max-width:300px;overflow-y:auto;overflow-x:scroll">
    <a href="#" style="display:block">sometext 1</a>
    ...
    <a ...>...</a>
</div>

这是一个简化版本，我知道阅读长代码是多么无聊:) 现在我需要让 div 正确使用 tne max-width 属性。我不需要跨浏览器解决方案 - 只有最新的浏览器可以支持它。

问题：

如果 A 元素的内容中有空格 - 它将在空格之后被包装。所以在这种情况下，“sometext”将在一行中，“1”在另一行中：并且不应该换行直到 300px；

如果我将“max-width:300px”添加到 A 元素 - “1”不会被包裹，但是填充被忽略并且数字“1”在通过萤火虫查看时仍然看起来超出范围。

我不知道我是否设法正确解释了这一点，但我希望我做到了。

如果您不理解问题：

我需要使用上面的结构制作一个“弹出菜单”元素，以便它可以自动扩展，但只能到 300x200 像素。达到极限。

谢谢你的想法

更新

看起来 Opera 在这项任务上表现不错，但 Firefox 却没有。这是一个例子：

http://jsfiddle.net/QGYwD/

4

1 回答 1

1

如果您不希望任何文本a换行，请给它们一个white-space:nowrap.

http://jsfiddle.net/QGYwD/1/

于 2012-10-25T13:48:10.513 回答