wrapping table

by jo_fog

HTML

<p>
 This is the table with p elements in the cells
 </p>
 
 <table>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td><p class="wrapit month">
      Januaryterriblylongvalue
    </p></td>
    <td>$100</td>
  </tr>
  <tr>
    <td><p class="wrapit month">
    February also long, but with whites-paces
    </p></td>
    <td>$80</td>
  </tr>
</table>

CSS

table {
  border: thin solid gray;
  border-collapse: collapse;
}
.month {
  width: 110px;
}
.saving {
  width: 100px;
}
table p {
  margin: 0px;
}
.wrapit {
  overflow-wrap: break-word;
}

td {
  border: thin solid gray;
}