3

I wonder why is there a padding on top and bottom. I want the border around "Reviewed by" and "date" without any padding. I have set cellspacing and cellpadding to zero. Is there any way to remove it using css?

<table width="100%" border="0" align="right" cellpadding="0" cellspacing="0">
  <tr>
    <td width="46%" rowspan="2">&nbsp;</td>
    <td width="1%" height="39">&nbsp;</td>
    <td width="19%">&nbsp;</td>
    <td width="22%">
      <p>
        <label for="Reviewd by"><br />
                </label>
        <p>
        </p>
    </td>
    <td width="10%">&nbsp;</td>
    <td width="10%"><br></td>
    <td width="2%" rowspan="2">&nbsp;</td>
  </tr>
  <tr>
    <td width="1%" height="81" style="border:3px solid black; border-right:hidden;">&nbsp;</td>
    <td width="19%" style="border:3px solid black; border-right:hidden; border-left:hidden;">
      <p>Reviewed by<br />
        <label for="Reviewd by5"></label>
        <input type="text" name="Reviewd by" id="Reviewd by5" />
      </p>
    </td>
    <td style="border: 3px solid black; border-left: hidden; font-size: 6pt;">
      <p>&nbsp;</p>
      <p>
        <select name="month6">
          <option value="1">January </option>
          <option value="2">February </option>
          <option value="3">March </option>
          <option value="4">April </option>
          <option value="5">May </option>
          <option value="6">June </option>
          <option value="7">July </option>
          <option value="8">August </option>
          <option value="9">September </option>
          <option value="10">October </option>
          <option value="11">November </option>
          <option value="12">December </option>
        </select>
        <select name="day6">
          <option value="1">1 </option>
          <option value="2">2 </option>
          <option value="3">3 </option>
          <option value="4">4 </option>
          <option value="5">5 </option>
          <option value="6">6 </option>
          <option value="7">7 </option>
          <option value="8">8 </option>
          <option value="9">9 </option>
          <option value="10">10 </option>
          <option value="11">11 </option>
          <option value="12">12 </option>
          <option value="13">13 </option>
          <option value="14">14 </option>
          <option value="15">15 </option>
          <option value="16">16 </option>
          <option value="17">17 </option>
          <option value="18">18 </option>
          <option value="19">19 </option>
          <option value="20">20 </option>
          <option value="21">21 </option>
          <option value="22">22 </option>
          <option value="23">23 </option>
          <option value="24">24 </option>
          <option value="25">25 </option>
          <option value="26">26 </option>
          <option value="27">27 </option>
          <option value="28">28 </option>
          <option value="29">29 </option>
          <option value="30">30 </option>
          <option value="31">31 </option>
        </select>
        <select name="year6">
          <option value="2002">2002 </option>
          <option value="2003">2003 </option>
          <option value="2004">2004 </option>
          <option value="2005">2005 </option>
          <option value="2006">2006 </option>
          <option value="2007">2007 </option>
          <option value="2008">2008 </option>
          <option value="2009">2009 </option>
          <option value="2010">2010 </option>
          <option value="2011">2011 </option>
          <option value="2012">2012 </option>
          <option value="2013">2013 </option>
          <option value="2014">2014 </option>
        </select>
      </p>
    </td>
    <td width="10%">&nbsp;</td>
    <td width="10%"><img src="images/EQUALHOUSING.PNG" width="79" height="76" /></td>
  </tr>
</table>
j08691
  • 204,283
  • 31
  • 260
  • 272
Ikhlak S.
  • 8,578
  • 10
  • 57
  • 77
  • 1
    I'd highly recommend using Chrome's "Inspect Element" feature. I made your code into a fiddle, and it looks like your `

    ` has a margin of 16. I think that's your issue.

     – snollygolly Feb 14 '14 at 14:42

2 Answers2

1

It is not a padding. Cells in row have always the same height. In your example "padding is caused by cell that is previous to "Reviewed by" - it has height set to 81px. If browser window is small "padding" is coming from word wrap in "date" cell

Damian Krawczyk
  • 2,241
  • 1
  • 18
  • 26
0

In addition to the answer above, chances are there is an element, button, or image, perhaps such that is only invisible on hover, that has a larger height, which is preventing the row from shrinking vertically.

Shimmy Weitzhandler
  • 101,809
  • 122
  • 424
  • 632