在HTML中对齐两个表

我正在尝试在html中对齐两个单独的表。我希望它们居中，左侧一个，右侧一个，桌子之间有一些空间。这是我当前设置的代码。我将它们对齐，但是一个在左边，一个在右边，它们之间有很多空间。HTML的新手，将不胜感激！

    <h1>
    Retrofit</h1>
    <p>
    Kendell Retrofit is the latest division to the Kendell divisions. Our Retrofit team includes customer service, outside sales, production and keying specialists.&nbsp;</p>
    <div>
    <table style="float:left">
    </table>
    <table align="left" border="0" cellpadding="0" cellspacing="2" style="width: 150px;">
        <thead>
            <tr>
                <th scope="col" style="text-align: left;">
                    Markets:<br />
                    &nbsp;</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    <ul>
                        <li>
                            Commercial</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Financial</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Global</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Government</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Healthcare</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Higher Education</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            K-12 Education</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Retail</li>
                    </ul>
                </td>
            </tr>
        </tbody>
    </table>
    </div>
    <div>
    <table style="float:right">
    </table>
    <table align="right" border="0" cellpadding="0" cellspacing="2" style="width: 150px;">
        <thead>
            <tr>
                <th scope="col" style="text-align: left;">
                    <p>
                        Brands:</p>
                </th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    <ul>
                        <li>
                            Arrow</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Best</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Corbin Russwin</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Dorma</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Falcon</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Kwikset</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Sargent</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Schlage</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Stanley</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Weiser</li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td>
                    <ul>
                        <li>
                            Yale</li>
                    </ul>
                </td>
            </tr>
        </tbody>
    </table>
</div>
<hr />
<p>
    &nbsp;</p>