How do I disable text wrapping, and add overflow-x:auto for table in CSS?

[xonteer]

Outcome I want:

First Name	Last Name	Points	Points	Points	Points	Points	Points	Points	Points	Points	Points
Bil	ates	50	50	50	50	50	50	50	50	50	50
Stee	Jos	94	94	94	94	94	94	94	94	94	94
Eln	Msk	67	67	67	67	67	67	67	67	67	67

<div style="overflow-x:auto;">
  <table>
    <tr>
      <th nowrap>First Name</th>
      <th nowrap>Last Name</th>
      <th nowrap>Points</th>
      <th nowrap>Points</th>
      <th nowrap>Points</th>
      <th nowrap>Points</th>
      <th nowrap>Points</th>
      <th nowrap>Points</th>
      <th nowrap>Points</th>
      <th nowrap>Points</th>
      <th nowrap>Points</th>
      <th nowrap>Points</th>
    </tr>
    <tr>
      <td nowrap>Bil</td>
      <td nowrap>Gats</td>
      <td nowrap>50</td>
      <td nowrap>50</td>
      <td nowrap>50</td>
      <td nowrap>50</td>
      <td nowrap>50</td>
      <td nowrap>50</td>
      <td nowrap>50</td>
      <td nowrap>50</td>
      <td nowrap>50</td>
      <td nowrap>50</td>
    </tr>
    <tr>
      <td nowrap>Stee</td>
      <td nowrap>Jos</td>
      <td nowrap>94</td>
      <td nowrap>94</td>
      <td nowrap>94</td>
      <td nowrap>94</td>
      <td nowrap>94</td>
      <td nowrap>94</td>
      <td nowrap>94</td>
      <td nowrap>94</td>
      <td nowrap>94</td>
      <td nowrap>94</td>
    </tr>
    <tr>
      <td nowrap>Eon</td>
      <td nowrap>Msk</td>
      <td nowrap>67</td>
      <td nowrap>67</td>
      <td nowrap>67</td>
      <td nowrap>67</td>
      <td nowrap>67</td>
      <td nowrap>67</td>
      <td nowrap>67</td>
      <td nowrap>67</td>
      <td nowrap>67</td>
      <td nowrap>67</td>
    </tr>
  </table>
</div>