CSS text.overflow 与 @Html.LabelFor

Question

当我的引导 div 列太小时，我想在 @Html.LabelFor 的末尾插入省略号。

如果我使用静态文本，它会正确显示为

Lorem ips...

已显示，但只要我使用 @Html.LabelFor，它就会将其切断为

Lorem ips

最后没有 ...。

这里是我的代码：-

    <style>
        .hideOverflow {
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
            display: inline-block;
        }
    </style>

        <div class="row">
            <div class="col-md-1 hideOverflow">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit.
@*                @Html.LabelFor(model => model.Balloon)*@
            </div>
            <div class="col-md-4">
                @Html.EditorFor(model => model.Balloon)
                @Html.ValidationMessageFor(model => model.Balloon)
            </div>
        </div>

任何帮助将不胜感激。

Answer 1

@Html.LabelFor 被渲染为<label> 你应该为<label>而不是div写你的css

类似以下的东西

.hideOverflow label{
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        display: inline-block;
}