次の例を検討してください:(ライブデモはこちら)
$(function() {
console.log("width = " + $("td").width());
});
td {
border: 1px solid black;
width: 50px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<tbody>
<tr>
<td>Hello Stack Overflow</td>
</tr>
</tbody>
</table>
出力は次のとおりwidth = 139
です。省略記号は表示されません。
ここで何が欠けていますか?
width
そしてheight
テーブルの上に細胞がいつものように使用され、最小限の幅と高さ。表のセルが違います!