Cheat Sheets CSS


Layouts

Centered div.

  div {
    background: red;
    bottom: 0;
    height: 100px;  /* Must use a declared height */
    left: 0;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    width: 100px;
  } 
    
  <div>I am centered, both vertically and horizontally.</div> 
Pros
Cons

Table.

<table>
  <thead>
    <tr>
      <th>Heading 1</th>
      <th>Heading 2</th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <td>Footer 1</td>
      <td>Footer 2</td>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>Cell 1</td>
      <td>Cell 2</td>
    </tr>
  </tbody>
</table>