/    Sign up×
Community /Pin to ProfileBookmark

Unwanted line return before hyperlink in IE

Hi,
I’m having problem resolving an issue with an unwanted line return before a hyperlink.

Ironically, it’s the “is this email not displaying correctly?” line in an HTML email newsletter.

It displays fine in Chrome and Firefox (all on one line), but IE behaves differently – the ‘View it in your browser’ link appears on a new line below.

There’s plenty of space in the TD for it to all fit.

My HTML is:

[CODE]<table border=”0″ cellpadding=”0″ cellspacing=”0″ height=”100%” width=”100%”><tr><td valign=”top” align=”center”>

<table cellpadding=”0″ cellspacing=”0″ width=”600″>
<tr><td bgcolor=”#E0E0E0″ height=”5″ style=”padding: 0px; margin:0;” valign=”top” align=”center” class=”smallprint”>Is this email not displaying correctly? <a href=”website” target=”Online”>View it in your browser</a>.</td></tr>[/CODE]

And the relevant CSS for the page is:

[CODE]#outlook a{padding:0;}
body {width:100% !important; font-size:12pt; color:#000000; -webkit-text-size-adjust:none; margin:0; padding:0; line-height:normal; font-family: Trebuchet MS,sans-serif; }

td a{width: 100%;}
.smallprint, .smallprint a {color:#575C60; font-family: ‘Times New Roman’,Times,serif; font-size: 10pt; line-height: 1.6em; text-decoration: none;}
.smallprint a:hover {color: #1D1D1D;}
[/CODE]

Any ideas why this is happening? I’ve tried playing around with the CSS ‘display’ tag but nothing seems to work… Any help appreciated!

to post a comment
CSS

4 Comments(s)

Copy linkTweet thisAlerts:
@jedaisoulNov 20.2014 — Do you have a general reset at the head of your CSS file? E.g.
<i>
</i>* {
margin:0;
padding:0;
border:none;
}

The above is not the best, but it works in most circumstances...
Copy linkTweet thisAlerts:
@derekjacksonauthorNov 20.2014 — Thanks, but that hasn't made any difference...
Copy linkTweet thisAlerts:
@rtretheweyNov 24.2014 — In your CSS, the rule:
<i>
</i>td a{width: 100%;}

means that the content within the <a></a> tags is allocated horizontal space equal to the full width of the parent containing block. Since the <a> appears on the same line as some preceding text, it forces the browser to start a new line block at that point.

Remove the rule.
Copy linkTweet thisAlerts:
@fwapkfqvgjsrDec 16.2014 — Oopppllkkjjuud231
×

Success!

Help @derekjackson spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...