強制錶行出現在同一行中使用CSS

我有一個兩行的表是這樣的：強制錶行出現在同一行中使用CSS

--------------------------- 
| 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>

來源

2012-09-12 adamf321

Giv在表述性的要求中，你是否確定這是事實上的表格數據？也許一個清單會更合適？ –

是的，大衛的權利。因爲您希望它使用無序列表向左浮動將是最好的。 – zero

我同意，但是我不想重寫我的cms代碼，如果我可以幫忙的話。我更喜歡一個CSS'黑客' – adamf321

爲我工作：

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

http://jsfiddle.net/N5fhU/

來源

2012-09-12 15:12:57 lvil

在一個側面說明，IE7是不會喜歡我相信。 – Jeroen

對不起，沒有在瀏覽器中檢查它。（僅限鉻） – lvil

謝謝。它適用於Chrome和IE8 ...我將不得不測試IE7。 – adamf321

你也可以刪除最後一個TR這樣，它會尋找所有在一行

<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-12 20:54:02

強制錶行出現在同一行中使用CSS

回答

相關問題