Solved

html for email newsletter - using tables -can't get rid of border/padding.

Posted on 2014-04-11
1
492 Views
Last Modified: 2014-04-17
I'm seeing this in firefox -very frustrating.

I'm using tables because I'm sending an html email.

notice the red border at the bottom of the page here (it's actually a red background that I'm using for testing)

http://cjehost.com/Friday-Email/t-rcc-1087611-vs2.html

I've tried everything I can think of to get rid of it. I'm adding a few more rows and the space can't be there.  Here's the code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html>
<head>
<title>Untitled Document</title>
<meta charset="utf-8">
</head>

<body>
<table width="600" height="578" border="0" cellspacing="0" cellpadding="0" style="background:red;padding:0; margin:0;height:578px;">
<tr>
<td valign="top" style="padding:0;margin:0;height:578px;border:none;"><img src="images/novartis-1.jpg" alt="You are cordially invited to attend a Speaker Program on: Managing Oral Oncology Products Throughout the Patient Continuum of Care" width="600" height="578" border="0"></td>
</tr></table>
<map name="Map">
  <area shape="rect" coords="448,86,550,102" href="http://www.novartis.com/privacy-policy.shtml" target="_blank" alt="Novartis Privacy Policy">
</map>
</body>
</html>

Open in new window

0
Comment
Question by:phillystyle123
1 Comment
 
LVL 75

Accepted Solution

by:
käµfm³d   👽 earned 500 total points
ID: 39995600
As discussed in this article:

http://salman-w.blogspot.com/2012/10/remove-space-below-images-and-inline-block-elements.html

...I suspect what you are seeing is related to the hangover of various letters such as p and q. Basically, your <img> is inline by default, and inline elements align themselves to the baseline of text. Basesline does not include the bottom parts of letters like p and q. So, even though you don't have any text in your cell, the CSS still makes room for the hangover because the <img> is an inline element. You can either change the display attribute of your image's style to be block, or you can set the cell's vertical-alignment to bottom.
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
Find out what you should include to make the best professional email signature for your organization.
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…

679 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question