jquery - 用文本扩展的表格行

Question

如何使表格行的高度完全相同？每当 <td> 中的文本超出了它扩展行的限制。我如何以一种它不那样做的方式做到这一点。而是显示更少的文字 这是代码

<div class="firstDiv" style="width: 200px; height: 200px;">

    <table border="1" style="border-collapse: collapse;">
        <tr style="height: 20px;">
            <th width="33%">First Name</th>
            <th width="33%">Last Name</th>
            <th width="33%">Country Of Origin OR MIG</th>
        </tr>
        <tr>
            <td>Mark</td>
            <td>Hopkins lee brimlow</td>
            <td>Not living in world right now</td>
        </tr>
    </table>
</div>

Answer 1

尝试将文本环绕在一个 div 周围

<div class="firstDiv" style="width: 200px; height: 200px;">

    <table border="1" style="border-collapse: collapse;">
        <tr style="height: 20px;">
            <th width="33%"><div>
            First Name
            </div></th>
            <th width="33%"><div>
            Last Name
            </div></th>
            <th width="33%"><div>
            Country Of Origin OR MIG
            </div></th>
        </tr>
        <tr>
            <td><div>
            Mark
            </div></td>
            <td><div>
            Hopkins lee brimlow
            </div></td>
            <td><div>
            Not living in world right now
            </div></td>
        </tr>
    </table>
</div>

并使用高度

th div, td div{
  height:40px;
  overflow:auto;
}

https://jsfiddle.net/L2awyezb/