Css 如何防止webkit中断长文本

Css 如何防止webkit中断长文本,css,text,webkit,Css,Text,Webkit,我想在状态栏中显示URL。我希望状态栏只有一行a处理文本溢出:省略号 长URL总是这样断开:jadajajaj- Jadajajdaj ajdjjajdaj 我希望它像Jadajajaj Jadajajdaj ajdj一样 我只知道: <div style="position:fixed;top:12.7ex;left:0ex;display:inline-block;width:100%;z-index:5;text-overflow:ellipsis;background:in

我想在状态栏中显示URL。我希望状态栏只有一行a处理文本溢出:省略号

长URL总是这样断开:jadajajaj-
Jadajajdaj ajdjjajdaj

我希望它像Jadajajaj Jadajajdaj ajdj一样

我只知道:

    <div style="position:fixed;top:12.7ex;left:0ex;display:inline-block;width:100%;z-index:5;text-overflow:ellipsis;background:inherit;">
        <div id="status-bar" class="ui-corner-all"
            style="width:1000%;display:inline-block;margin-right:1.4ex;padding:0.3ex 0.5ex 0ex 1ex;overflow-y:hidden;overflow-x:hidden;color:grey;font-size:3.3ex;height:3.2ex;font-weight:normal;text-align:left;"></div>
    </div>

我使用宽度:1000%来克服这个问题,但我不会看到。。。像这样的省略号


我尝试用CSS属性来修复它-webkit连字符:无,word wrap:normal,没有任何东西可以正常工作。。。我缺少文字包装:保留全部。这在当前版本的chrome 20.0.1132.57 m中无法识别。

您正在查找文本溢出属性。通过将
文本溢出:省略号
空白:nowrap
应用到状态栏,您将看到所需的效果。但是,必须设置要截断的元素的宽度,以便浏览器知道何时/何处附加省略号。(确保删除或更改
宽度:1000%


哇!我错过了空白:nowrap;在显示URL时考虑空白属性有点违反直觉:-干杯!
#status-bar {
 text-overflow: ellipsis;
 width: 100%; /* or whatever you prefer */
 white-space: nowrap;
}