How to make td (table cell) height to be the same as an < a> (link element) height?


I have created a simple example that contains the issue.

There is a code from fiddle:

      <a href="#">
a {
  display: block;
  font-size: 16px;
  line-height: 16px;

Expected result: td has height 16px the same as a link.

Actual result: td has height 18px that is 2px more than a link height.

>Solution :

try removing the padding from the td elements :

/* if you only want to keep the same height */
td {
   padding-top: 0;
   padding-bottom: 0;

/* or remove the padding from all edges */

td {
   padding: 0;

Leave a ReplyCancel reply