小编And*_*eas的帖子

在单词内断字

我有这个HTML

<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>
Run Code Online (Sandbox Code Playgroud)

这个css

.externalWidth { width: 200px; }
.container { margin-bottom:10px; display:inline-table; height:40px; width:100%; }
.element { display:table-cell; }
.noWrap { white-space:nowrap; }
Run Code Online (Sandbox Code Playgroud)

我已经制作了一个jsfiddle来演示它.两个文本.element都是从服务器读取并通过敲除绑定.我希望这看起来如下:

  • 第二个.element应该有所需的空间
  • 第一个.element应该有剩余的空间.如果可能的话,它应该分成多行.

一切都很好但长话会导致整个表格扩展.如果有必要,是否有可能在言语中打破?

我也尝试了,table-layout:fixed;但是那两个100px柱子.

编辑:谢谢.word-break: break-all;完全按照我的需要做了.

html css

5
推荐指数
1
解决办法
243
查看次数

标签 统计

css ×1

html ×1