Question

在我的div中，它以百分比为基础定义了width。但text-overflow无法正常工作。

如何管理？

＆＃13;

div {
    width:50% /* instead giving 500px works!*/
    white-space: nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

＆＃13;

<div>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</div>

＆＃13;

Answer 1

您在;财产后遗失了width因此忽略了您的其他财产。所以，即使您的width未获胜，也不会white-space因为先前的陈述没有以;

终止

div {
    width:50%;
    white-space: nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    margin: auto;
}

Demo

Answer 2

主要问题是width属性后缺少分号（;）。因此，它忽略了前两个属性。缺少结束分号，两个属性都被识别为一个属性。

div {
     width:50%; /* instead giving 500px works!*/
    white-space: nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

Answer 3

只有问题是分号，省略号也适用于百分比。添加分号后，您的代码就可以了。

CSS - 文本溢出不适用于基于百分比的div

3 个答案: