Define horizontal initial scrolling point

Question

I have an element that contains a fixed width table, and when the screen size became smaller, the table can be scrolled horizontally. My question is, is there a way to define the initial scrolling point, lets say, 50px from the left?

body {margin: 0}

.wrapper {
  overflow-x: scroll;
}

table {
  width: 800px;
  border: 1px solid;
}

th, td {text-align: center; border: 1px solid}

<div class="wrapper">
  <table>
    <tr>
      <th colspan="3">Heading</th>
    </tr>
    <tr>
      <td>Data 1</td>
      <td>Data 2</td>
      <td>Data 3</td>
    </tr>
  </table>
</div>

Answer 1

Another way you can use

                              $(".wrapper").css("scrollLeft","50")