-1

demo http://jsfiddle.net/7MzfR/5/

here is my code, I already set border-spacing to zero, but there is a strange extra space under the images

  <table style="border-spacing:0px" width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
            <td style="padding-left:20px">
                <p>Interviewing soon?</p>
            </td>
        </tr>
        <tr>
            <td style="padding-left:20px">
                <p>Interviewing soon? blab blaa</p>
            </td>
        </tr>
    </table>
user3155747
  • 51
  • 5

4 Answers4

0

You have padding-bottom: 5px; of the <td> element, as far as I see. Try setting it to 0px

Alex Marinov
  • 191
  • 1
  • 5
0

As the poster above said, set your padding attribute to 0px.

I would asume you copied that table from somewhere without knowing what html attributes do, am I right?

If not I have some advice to add:

you should install and use "Firebug" (A plugin for Firefox or Google Chrome), rightclick on your space, "inspect element with firebug" and then try disabling different attributes with the css attribute editor on the right side until your whitspace goes away and then you know what you have to change in your code.

Steini
  • 2,753
  • 15
  • 24
0

Just adding somthing onto Steini's answer here:

Here is a useful guide on using chrome's built in web inspector.

https://developers.google.com/chrome-developer-tools/

These kinds of tools can be very overwhelming to new users so this should help you get used to the UI and start using its features effectively.

Jonjoe
  • 171
  • 8
0

If you want to achieve the fix cell content kind of layout than you can do following css changes

{have to remove the bottom-padding from td }

.fixCell td {  height:120px; display: inline-block;}

Fiddle Demo

Neha
  • 1,548
  • 2
  • 10
  • 13