Edit in JSFiddle

<section>
    <div>
        <table>
            <tr>
                <td>test</td>
                <td>test</td>
            </tr>
        </table>
        <table>
            <tr>
                <td>test</td>
                <td>test</td>
            </tr>
        </table>
        <table>
            <tr>
                <td>test</td>
                <td>test</td>
            </tr>
        </table>
    </div>
</section>

section{
    width: 400px;/*ポイント04*/
    border: 1px solid #000000;
}
div{
    width: 330px;/*ポイント03*/
    border: 1px solid #000000;
    margin-left: auto;/*ポイント01*/
    margin-right: auto;/*ポイント01*/
}
table{
    width: 100px;/*ポイント03*/
    float: left;/*ポイント02*/
    margin-left: 5px;/*ポイント03*/
    margin-right: 5px; /*ポイント03*/ 
    border: 1px solid #000000;
}