如何在同一行上创建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>内做这个并浮动框。