CSS＆amp; HTML：在表行问题的开头和结尾处对内容进行间隔

Question

我一直在疯狂，想知道如何做到这一点。 我有一张桌子。在表格行的一端，我想要我的产品描述，另一端是我的产品价格并添加到购物车按钮。没有任何介于两者之间。 但是，如果不使用无限的新表行标记，我不能让它立即工作，我不想这样做。

我尝试了什么：

• 保证金权利
• 填充

我不能使用border spacing或cellspacing，因为我只希望在我的2个表行中有1个发生这种情况。有什么建议吗？...

＆＃13;

＆＃13;

<table>
<tr>
<td><p id='prods_nme'>$prod_name</p></td>
</tr>
<tr>
<td class='spacing'><p id='prods_desc'>$prod_desc</p></td>
<td></td>
                                  
<td class='spacing' rowspan='2'><p id='prods_price'>£$prod_price</p></td>
<td><a href='Shopping_cart.php?add_item=$prod_id'>+</a></td>
</tr>
</table>

＆＃13;

%SI_NAME%

＆＃13;

＆＃13;

＆＃13;

我希望它看起来像这样：

Answer 1

你正在思考这个问题。

您不需要额外的行。

＆＃13;

＆＃13;

table {
  width: 100%;
  border: 1px solid grey;
}
table td {
  border: 1px solid red;
}
table td.full {
  width: 100%;
}

＆＃13;

<table>
  <tr>
    <td class="full">
      <p id='prods_nme'>My Product</p>
      <p id='prods_desc'>My Product Desription</p>
    </td>
    <td class="price">
      <p id='prods_price'>£10.00</p>
    </td>
  </tr>
  <tr>
    <td class="full">
      <p id='prods_nme'>My Product</p>
      <p id='prods_desc'>My Product Desription</p>
    </td>
    <td class="price">
      <p id='prods_price'>£10.00</p>
    </td>
  </tr>
</table>

＆＃13;

＆＃13;

＆＃13;