如何在同一行上製作html表格？ WordPress的，woocommerce

Question

我修改checkout page，我創建了兩個表，並使用css display: inline-block;使這些在同一行。但是，表格內的內容不能填充表格的所有空間。我該如何解決它？

感謝

的 table 1

HTML代碼：

<table class="shipping_table" border="0" cellpadding="0" cellspacing="0"> 
     <tbody> 
      <tr> 
       <td>   
        <p class="form-row form-row validate-required" id="address_list_field"> 
         <label for="address_list" class="">Delivery region: <abbr class="required" title="required">*</abbr></label> 
          <select name="address_list" id="address_list" class="select " data-placeholder=""> 
           <option value="3">1/F, G Block, Kc park</option> 
          </select> 
        </p> 
       </td> 
      </tr> 
     </tbody> 
    </table> 

CSS：

.shipping_table { 
     display: inline-block; 
     width: 48%; 

    } 

    .billing_table 
    { 
     display: inline-block; 
     width: 48%; 


    } 

Answer 1

你爲什麼不封閉兩個表到一個表有兩個單元？
設置外表，使<td>的寬度爲50/50。
將內部表是100％的寬度（.shipping_table，.billing_table）

在一個完美的世界裏，你應該內<div> s內這樣做的，浮動框。