如何對齊兩個欄一起在一個<a tag

Question

I trying to align or to put on the same line this HTML

Actual output looks like this

Cart: 

Payment >> 

Add another item >> 

Product Price Quantity 

Toaster 19.99 1   Update Cart        
              Remove from Cart <== I want this column align with 
                    the update cart or on the same 
                    line 

Total      19.99 

I will like to have the Update Cart and Remove on different line but align or have them on the same line

Here is the Index.cshtml

 @{int ix = 0;} 

     @foreach (var item in Model.CartItems) 
     { 
      <tr id="row-@item.ProductId"> 
       <td> 
        @Html.ActionLink(item.Produit.Description, "Details", "Product", new { id = 
         item.ProduitId }, null) 
       </td> 
       <td> 
       @item.Product.Price 
       </td> 
       <td> 
       @Html.TextBoxFor(model => model.CartItems[ix].Quantity, 
        new {style = "width:30px; text-align:right;", 
        onkeyup = "clearUpdateMessage();", 
        onchange = "clearUpdateMessage();" 
        }) 
       </td> 
       <td> 
       <a href="#" class="RefreshQuantity" data-id="@item.PanierId" 
        id="CartItems_@(ix)__Quantity"> Update Cart >> <a /> 
       </td> 

       <td> 
       <a href="#" class="RemoveLink" data-id="@item.PanierId"> Remove from Cart >> 
       </a> 
       </td> 
      </tr> 
      ix++; 
     } 

Answer 1

You need to set the css width property on the individual td's.

<td style="width: 100px"> //or use % if your planning on multiple media</td> 
<td style="width: 100px:> </td> 

set the size of the td's accordingly.

You may want to look into Twitter Bootstrap，這個庫使得CSS很容易與類

UPDATE操作：

使用％，而非像素很難在一小部分顯現。我不知道當你切換媒體時你想讓你的屏幕看起來像什麼樣子。它可以像你想在交換媒體時縮小屏幕一樣簡單。

<td style="width: 15%"> </td> 

這可能是因爲你想，如果你交換到小如手機在這種情況下，你將要爲特定媒體的CSS類的東西來改變佈局。隨着世界走向一次編寫，隨處運行（WORA）開發（twitter bootstrap，xamarin，PhoneGap等），你將不得不自己決定什麼對你的情況最好。

UPDATE：

Here is a fiddle of what I am suggesting