Here's a DEMO

Here's my HTML:

<div>
    <table>
        <tbody>
            <tr>
                <td>A1</td开发者_开发问答>
                <td>B1</td>
            </tr>
            <tr>
                <td>A2</td>
                <td>B2</td>
            </tr>
        </tbody>
    </table>
</div>

and CSS:

div {
    position: relative;
    left: 100px;
}

table {
    border: 1px solid black;
}

As you can see in the demo, it causes horizontal scrollbars. Is there any way to get rid of this, other than using javascript?

instead of left maybe try

margin-left: 100px;