[Solved] Large copy margin issue

[dodgson]

Hi Guys and Gals. I was hoping one you may have the answer to an issue I’m having. I’m creating an email newsletter with pricing for a particular product. I’m trying to make the price quite large, but the larger I get with the font, the larger the gap at the top of the price gets. I have tried everything from Margin and Padding set to 0, etc. Any help would be greatly appreciated. The following is a link to a screenshot of the problem. http://www.simsstaging.com/_sites/gardenGallery/picture.jpg. The following is also the HTML. Thanks for taking the time to look at this. Much appreciated.

Code:

Pansies

The hardiest of all garden annuals, pansies tolerate much cooler temperatures than other flowers. Heart-shaped blooms bring beautiful colour to your early spring garden. For best results, plant in full sun to part shade. Many colours to choose from.

79^¢

4 pack. Reg. $1.29.

Code:

td.mainbar h1.price {
font-family: Georgia, “Times New Roman”, Times, serif;
font-size: 180px;
display: inline;
letter-spacing: -3px;
font-weight: normal;
color: #000000;
text-transform: uppercase;
}

[jlknauff]

line-height:100%;

Play with the value, but that should solve your problem.

Also – keep in mind, CSS may not display uniformly when it comes to email. Test in multiple environments before you send it.

[dodgson]

Thanks for responding jlknauff. I did try that. I also tried using line-height: 1em; , neither of these solutions seem to work. Do you have any other suggestions?

[TheDoc]

Line-height:0; .. what happens then?

Providing a live link to the newsletter would greatly help.

Also, reiterating what jlknauff said, it’s very important to note that CSS will NOT display the same across all email clients. It is the one time where tables are your bestest friend.

[dodgson]

Hi Guys, thanks for the responses. It turns out it was the superscript html tag that was causing the issue. Thanks again.

[Author]

Posts