我有这个HTML文件。
我已经制作了一个jsfiddle来加以说明。两个
我还尝试过
编辑:谢谢。
<div class="externalWidth">
<div class="container">
<div class="element">this_is_a_really_long_text_without_spaces</div>
<div class="element noWrap">:-)</div>
</div>
</div>
<div class="externalWidth">
<div class="container">
<div class="element ">this is a really long text without spaces</div>
<div class="element noWrap">:-)</div>
</div>
</div>
还有这个CSS
.externalWidth { width: 200px; }
.container { margin-bottom:10px; display:inline-table; height:40px; width:100%; }
.element { display:table-cell; }
.noWrap { white-space:nowrap; }
我已经制作了一个jsfiddle来加以说明。两个
.element
里的文本是从服务器上读取并通过knockout绑定的。我希望它看起来像这样:
- 第二个
.element
应该有尽可能多的空间。 - 第一个
.element
应该占据剩余的空间。如果可能的话,它应该可以分成多行。
我还尝试过
table-layout:fixed;
,但这使得两个100px
的列。编辑:谢谢。
word-break: break-all;
正是我所需要的。
word-break: break-all;
吗? - Kyleword-break: hyphenate:
... - Kyle