Two tables on same line

<!-- css  -->
.data-table {
    margin-top: 30px;
}


.table {
    float: left;
}


.fixedCol {
    width: 50px;
    display: inline-table;
}


<!-- html -->
<div class="data-table">
    <!-- fixed first column table -->
    <table class="table fixedCol">
        <thead>
            <tr>
                <th>Client ID</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    #1
                </td>
            </tr>
        </tbody>
    </table>

    <!-- table -->
    <div class="table-responsive">
        <table class="table table-striped scrollCol"> <!-- table table-striped -->
            <thead>
                <tr>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>Registration Date</th>
                    <th>Campaign</th>
                    <th>Language</th>
                    <th>Status Country</th>
                    <th>Campaign Country</th>
                    <th>Client Country</th>
                    <th>Phone</th>
                    <th>Email</th>
                    <th>Currency</th>
                    <th>Account</th>
                    <th>Status</th>
                    <th>Account Ballance</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>John</td>
                    <td>Travolta</td>
                    <td>1.04.2013</td>
                    <td>Cube</td>
                    <td>Romanian</td>
                    <td>Moldova</td>
                    <td>Moldova</td>
                    <td>Moldova</td>
                    <td>Nokia</td>
                    <td>admin@example.com</td>
                    <td>EUR</td>
                    <td>Yes</td>
                    <td>Flying</td>
                    <td>0</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>