时间戳

首页 > 解决方案 > 宽度，最大宽度不适用于

html - 宽度，最大宽度不适用于

问题描述

我需要为我的文本设置最大宽度，以防文本太长。我试图设置“宽度”和“最大宽度”，但没有成功。

现在它看起来与太长的文本。

文本太长

<tr>
<td class="no-wrap">
<div class="grid-item-margin-left">@Html.DisplayFor(m => checkListItem.StepNumber).</div>
</td>
<td>
@Html.DisplayFor(m => description)
</td>

我的问题在

<td>
@Html.DisplayFor(m => description)
</td>

我试过这个解决方案：

<td>
<p style="max-width:60ch">@description</p>
</td>

但是第二个屏幕上的结果：

文本覆盖

更新：感谢您的建议！我试过这个

.long-text-trim {
    white-space: nowrap; 
    overflow: hidden;
    text-overflow: ellipsis; 
    max-width: 60ch;
}

它有效。但！我还有另一个问题：当我最小化窗口时，我想更多地修剪文本。如何实施？

标签： htmlcssrazor

解决方案

这很好用：

.long-text-trim {
    white-space: nowrap; 
    overflow: hidden;
    text-overflow: ellipsis; 
    max-width: 20vw;
}

推荐阅读