Fix displaying hover tooltip on smaller screens

The tooltip was displayed using hacky ways. If the width of the screen
was above a certain threshold, we displayed a container (floating to the
right) with the contents. This container was hidden for smaller screens.

A better way of showing the tooltip is to nest the columns. By doing so,
we get rid of the magic number used to hide/show the container. We also
have to no longer use "float: right".
Make CSS formatting consistent with the rest of the file
Use nested columns for displaying the header
Minor CSS fix

Add right padding to hover