Table and span overlay


How can i make the button on top right so the background fills the <th> completely in this area, without these margins around it?

Problem courtesy of: user3187469


I noticed you have a padding:3px on the th of the table. I changed the markup a little by adding a couple of classes and a span for the title.

       <th class="title" colspan="2"><span class="main">Title </span><span class="pull-right"><a href="#">button</a></span>

.table.table-thin thead th.title {padding:0px}
.table.table-thin thead th.title span {padding:3px;}

Here the updated forked jsfiddle.

Solution courtesy of: Joe Saad


insert to your css display:block;

Discussion courtesy of: FarwallGhost

This recipe can be found in it's original form on Stack Over Flow.