Question

我正在尝试制作两列的问题和答案表。第一列应只包含问题编号，以便将实际问题和答案与第二列对齐。

但是，我希望问题编号在问题旁边，以便所有内容看起来像一个句子。由于某种原因，包含数字的第一列占用的宽度过多。

我如何使其仅占据所需宽度？

.title {
  font-size: 24px;
  font-weight: 500;
  letter-spacing: .3px;
  padding-bottom: 32px;
  color: #333;
}

<table border="0" cellpadding="0" cellspacing="0" class="faq" width="666">
  <tbody>
    <tr>
      <td class="title">FAQ</td>
    </tr>
    <tr>
      <td class="question">1.</td>
      <td class="question">What happens when the wild tigers purr?</td>
    </tr>
    <tr>
      <td>&nbsp;</td>
      <td class="answer">Sixty-Four comes asking for bread. If Purple People Eaters are real… where do they find purple people to eat?</td>
    </tr>
  </tbody>
</table>

Answer 1

这是因为您的

<td class="title">FAQ</td>

也在该列中，并且占用了大量空间。解决此问题的一种方法是将其从表中删除。修改后的版本如下：

<div class="title">FAW</div>    

<table border="0" cellpadding="0" cellspacing="0" class="faq" width="666">
    <tbody>
        <tr>
            <td class="question">1.</td>
            <td class="question">What happens when the wild tigers purr?</td>
        </tr>
        <tr>
           <td>&nbsp;</td>
           <td class="answer">Sixty-Four comes asking for bread. If Purple People Eaters are real… where do they find purple people to eat?</td>
        </tr>
    </tbody>
</table>

您可能遇到的另一个问题是<tr>标签无法与问题/答案对齐一起使用。首先尝试为您的桌子做一个快速计划，因为实际上很难做到。

表的第一列占用太多宽度？

1 个答案: