Html 如何减少表格单元格中不需要的空间

在我的html中，我使用一个表来显示起始日期选择器。修复日期选择器后，单元格占用了大量空间，因此我无法将该表放在网页旁边

这是我的html

<table border="1"  cellspacing="0" >
  <tr>
    <td><input id="ir-box" type="checkbox"/></td><td colspan="3">Only show LIVE reports</td>
  </tr>
  <tr>
    <td colspan="3"><input type="text" value="Keyword Search"/></td><td>{% include "buttons/go.html" %}</td>
  </tr>
  <tr>
    <td colspan="4"><input class="incident-type" type="text" value="All Incident types" /></td>
  </tr>
  <tr>
    <td colspan="4"><input class="incident-type" type="text" value="All Location types"/></td>
  </tr>
  <tr>
    <td colspan="2">From</td><td colspan="2">To</td>
  </tr>
  <tr>
    <td colspan="2"><input class="datefield" id="fromdate" type="text" value="dd/mm/yyyy"/></td><td colspan="2"><input class="datefield" id="todate" type="text" value="dd/mm/yyyy"/></td>
  </tr>
  <tr>
    <td>s</td><td>f</td><td>s</td><td>{% include "buttons/go.html" %}</td>
  </tr>
</table> 

仅显示实时报告
{%include“buttons/go.html”%}
从
sfs{%include“buttons/go.html”%}

我正在使用django web框架，使用html设计网页

1.如何减少单元格内的空间，以便我可以将表格放在网页旁边。需要帮助

---

谢谢

您可以使用HTML中的单元格填充来减少空间，如下所示：

---

正确的方法是使用CSS为td设置填充，您只需在CSS文件中为表格适当地应用填充即可。例如（CSS）

这是最上面、最右边、最下面、最左边和一种表示填充的简写方式

更多：

tr {padding: 5px 5px 5px 5px;}