width, max-width tidak berlaku untuk <td>

0
Pilih

Saya perlu menyetel lebar maksimal karena teks kasus saya akan terlalu panjang. Saya mencoba menyetel"width"dan"max-width", tetapi tidak berhasil.

Saya perlu menyetel lebar maksimal agar teks seandainya saya terlalu panjang. Saya mencoba mengatur"lebar"dan"lebar maksimal", tetapi tidak berhasil.

Sekarang tampilannya dengan teks yang terlalu panjang.

Sekarang tampilannya dengan teks yang terlalu panjang.

teks terlalu panjang

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

Masalah saya ada di

Masalah saya ada di
<td>
@Html.DisplayFor(m=> description)
</td>
<td> @Html.DisplayFor(m=> description) </td> @Html.DisplayFor (m=>deskripsi)

Saya mencoba solusi ini:

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

@description

Namun hasil di layar kedua:

Namun hasil di layar kedua:

penggantian teks

text overridetext override

PEMBARUAN: Terima kasih atas sarannya! Saya mencoba ini

UPDATE: Terima kasih atas sarannya! Saya mencoba ini
.long-text-trim {
    white-space: nowrap; 
    overflow: hidden;
    text-overflow: ellipsis; 
    max-width: 60ch;
}
.long-text-trim { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 60ch; } . Trim-teks-panjang { ruang putih: nowrap; overflow: hidden; text-overflow: elipsis; lebar maks: 60ch; }

dan berhasil. TAPI! Saya memiliki masalah lain: ketika saya meminimalkan jendela, saya ingin memangkas teks lebih banyak. Bagaimana cara menerapkan ini?

dan berhasil. TAPI! Saya memiliki masalah lain: ketika saya meminimalkan jendela, saya ingin memangkas teks lebih banyak. Bagaimana cara menerapkan ini?

Sumber

css html razor

1 -Julien Baldy

3 -Pete

1 Menjawab
0
Pilih

Itu berfungsi dengan baik:

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

Anda Mungkin Menarik

© 2021   Pemrograman.Net