Coloring a Table Cell

There shouldn’t be any argument that a good-looking page (coupled with meaningful content) should entice a user to come back. I recently found a simple way to add color to a table cell on a wiki page and this is how it works.

A hex code consists of 7 digits, # plus letters and numbers. I find the site color-hex useful and will use #ff52ef in my example. That will turn the cell into a nice pink 🙂

Html code snippit to add: background-color: hex-code

  • Navigate to your wiki page –> edit page –> navigate to table cell you want to color
  • Click with your cursor into the cell of the table
  • On the top ribbon select Format Text –> Edit Source
  • In the source code look for the html tag <td>, which stands for standard cell
  • Add the code before the html closing tag “></td>

Html before adding the snippit:

<td class=”ms-rteTableEvenCol-default” style=”width: 50%;”>​</td>

Html after adding the snippit:

<td class=”ms-rteTableEvenCol-default” style=”width: 50%; background-color: #ff52ef;”>​</td>

Text added to the cell becomes part of the code, and it can be cumbersome to figure out where to add the code snippit. I therefore recommend coloring the cell first.