adding up- and downarrows in table headers with CSS :after

gistfile1.css

table {
  border-collapse: collapse;
  border-spacing: 0;
}

table th.header {
  background-color: #F3F781;
  padding-right: 0px;
  cursor:pointer;
}

table th.header:after {
   content: "\0000a0\0000a0";
}

table th.headerSortUp, table th.headerSortDown {
  background-color: lightblue;
}

table th.headerSortUp:after {
   content: "\0000a0\2912";
   color:blue;
}

table th.headerSortDown:after {
   content: "\0000a0\2913";
   color:blue;
}

table td, table th {
  border: 1pt solid #333;
  padding: 0.25em 0.5em;
}

I added two encoded space characters on the right as default and if it is clicked it changes into the arrows with a preceding space.

used it here: http://stackoverflow.com/questions/19386871/obfuscate-emails-with-ruby-to-protect-against-harvesters
and here: ffnord/ffmap-d3#35