如何使我的html td元素适合更改窗口大小？

Question

**THIS IS MY HTML**

<div class="table">
<table>
<tr>
<td><a href="otherpage.html">Home</a></td>
<td><a href="otherpage.html">About us</a></td>
<td><a href="otherpage.html">Testimonials</a></td>
<td><a href="otherpage.html">Contact us</a></td>
<tr>
</table>
</div>

这是我的CSS

html,body{
margin:0;
height:100%;
background: linear-gradient(red,pink);
}
.table{
background-color:black;
margin:0;
}
td,a{
padding:25px;
margin:80px;
}

当我缩小窗口大小时，td中的一些文本会转到下一行。如何停止？
这是正常的：

这是在减少窗口大小之后：

Answer 1

尝试将以下代码添加到CSS中： td a { white-space: nowrap; }

Answer 2

html,body{ margin:0; height:100%; background: linear-gradient(red,pink); } .table{ background-color:black; margin:0; } td,a{ padding:20px;  }

<div class="table">
<table>
<tr>
<td><a href="otherpage.html">Home</a></td>
<td><a href="otherpage.html">About us</a></td>
<td><a href="otherpage.html">Testimonials</a></td>
<td><a href="otherpage.html">Contact us</a></td>
<tr>
</table>
</div>

Answer 3

添加到您的体宽：100％或watever然后在您的表中指定宽度和高度百分比 所以，假设你的桌子需要与身体宽度和身高相匹配，那么你需要在你的css表中添加宽度：100％和高度：100％或者你喜欢的任何百分比