换行时带元素宽度?

时间:2011-05-04 18:39:17

标签: html width css linewrap

这似乎可能是一个死胡同的问题,但是在可能有某种方法可以做我想要的事情的机会中,我想我会在放弃之前在stackoverflow上问天才。
任何类型的解决方案(Javascript,CSS等)都可以!

我可以在此页面上看到我想要做的事情: http://willdo.ca/test.php

我注意到当一行包含一个具有自动宽度的元素(例如内联块元素),并且设置了最大宽度时,空格仍会导致元素填充到最大宽度,即使文本在技术上达不到这个最大宽度(虽然我理解为什么它的行为方式如此,因为从技术上讲,这是在线被强制换行之前元素的宽度)。

希望我提供的页面能够更好地描述我在这里尝试过的内容 第一个概述的元素是正常(正确)行为 第二个概述元素是我想要创建的行为(通过添加换行符来模拟)。

以下是查看/下载我已使用过的HTML的链接:http://willdo.ca/test.txt

1 个答案:

答案 0 :(得分:0)

文本首先包装的唯一原因是它击中了由auto(父宽度)/ px /%或最大/最小宽度定义的元素边缘。然后它将所有其他文本推送到下一行,将文字保持在一起(显然)。

我能看到的唯一可以想象的方法是计算实际文本的宽度,并在JS中相应地调整框的大小。对于这样的问题和严重的过度杀伤,这是非常困难的。它需要计算每个字符宽度(不完全相同),它们取决于客户端的DPI,字体类型,浏览器缩放,可访问性功能以及许多其他内容。

很抱歉看起来不太可能,情况如何?这是你的例子中非常大的字体,其目的是长篇大论。