2

次のような 2 行のテーブルがあります。

---------------------------
| 1 Item | Total: $370.00 |
---------------------------
|   View Cart   Check-out |
---------------------------

次のようにインラインで表示したい:

| 1 Item | Total: $370.00 | View Cart   Check-out |

これはCSSで可能ですか?注: 残念ながら、このコードは私の CMS によって生成されたものであり、div を使用してから CSS の float:left または display:inline-block を使用するように変更することは困難です。

簡略化された HTML:

<table class="cart-block-summary">
 <tbody>
  <tr>
   <td class="cart-block-summary-items">1 Item</td>
   <td class="cart-block-summary-total">Total: $370.00</td>
  </tr>
  <tr class="cart-block-summary-links">
   <td colspan="2">View cart  Checkout</td>
  </tr>
 </tbody>
</table>
4

2 に答える 2

7

私のために働いた:

   ​​table { width: 600px;}
    tr{float:left}​

http://jsfiddle.net/N5fhU/

于 2012-09-12T15:12:57.623 に答える
0

最後のTRを削除して、すべてを1行で表示することもできます。

<table class="cart-block-summary">
 <tbody>
  <tr>
   <td class="cart-block-summary-items">1 Item</td>
   <td class="cart-block-summary-total">Total: $370.00</td>
   <td class="cart-block-summary-links" colspan="2">View cart Checkout</td>
  </tr>
 </tbody>
</table>
于 2012-09-12T20:54:02.670 に答える