Solved

<br> tags and spacer images in HTML emails

Posted on 2011-03-25
5
191 Views
Last Modified: 2012-05-11
Hi

I just wanted to know peoples thoughts on the best way to get pixel perfect spacing between paragraphs etc in html emails.

I have experience of using br and p tags that cause inconsistencies in spacing within different email clients. So, to combat this i have been using spacer images. Some people say this is a bad idea - is this true and if so any advise how spacing should be tackled?

Cheers
0
Comment
Question by:coolispaul
5 Comments
 
LVL 40

Expert Comment

by:gurvinder372
ID: 35215644
why don't you use the css div combination?
0
 
LVL 12

Expert Comment

by:Amick
ID: 35216678
You can use CSS styles to precisely position each element.

If you're just looking to adjust spacing, something like
<br/><span style="line-height:___px;">&nbsp;<br/></span>

Open in new window

might help you get around the images issue.
0
 
LVL 43

Expert Comment

by:Chris Stanyon
ID: 35230609
Always use CSS for layout. You should never use images or <br /> for spacing. Many people have images turned off in emails, so not only is it bad practice, it would also blow your layout.

To set the spacing below paragraphs simply add a margin-bottom rule to your P tags in CSS.

p { margin-bottom: 25px; }


0
 

Author Comment

by:coolispaul
ID: 35433828
i tried this but i only seem to get success by using spacer images for all clients
0
 
LVL 43

Accepted Solution

by:
Chris Stanyon earned 500 total points
ID: 35433943
You may need to 'reset' your CSS rules to make your styling as consistent as possible across al clients.

Have a read here - http://meyerweb.com/eric/tools/css/reset/  - and then download and link to the reset.css stylesheet.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
IFRAME in a ASPX file no longer working 3 27
Javascript Hashmap output 8 46
Javascript create file issue 4 48
Target h5 of a div 3 8
Ransomware continues to be a growing problem for both personal and business users alike and Antivirus companies are still struggling to find a reliable way to protect you from this dangerous threat.
An analysis of the phishing scam that has been affecting Google users, along with steps to take for protection, as well as what to do if you receive one of the emails.
In this tutorial viewers will learn how to style a decorative dropcap for the first letter in a paragraph using CSS. In CSS, create a new paragraph class by typing "p.fancy": Then, to style only the first letter of the first sentence, include the ps…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

920 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

Need Help in Real-Time?

Connect with top rated Experts

14 Experts available now in Live!

Get 1:1 Help Now