I recently had a few problems with Outlook / Hotmail adding ( and not adding ) random margin / padding on p, h1 etc elements so I resorted to using <span> with specific classes:

<span class="heading1">Heading</span>
<span class="paragraph">A paragraph</span>

and I wanted to get folks opinion as to whether this is a good or bad idea or if anyone can foresee (or have experience of) any issues from doing this.

So far, the designs I have tested seem to work without any bother. From Lotus to Gmail. I like to code with standards in mind but HTML eflyers are a different kettle of fish.

Any thoughts?

Redferret, 4 years ago

What clients have you tried? My worry is that your sort of changing it to a block-line element and I'm sure some don't respect that for inline elements like span.

Gmail app apologist
versus, 4 years ago

Sorry for the late reply Redferret. On a job.

I've ran the CM test an they came out fine in all clients, even Lotus Notes. The only thing that didn't work properly was the line height (Lotus Notes only).

Having said that. I just created a editable template for a client and because CM's language automatically adds p elements I had to use them so it used a mixture of <div class="heading1"> and <p> and bot the p and the div cam out fine! Perhaps I'm complicating it all!

See why 200,000 companies worldwide love Campaign Monitor.

From Australia to Zimbabwe, and everywhere in between, companies count on Campaign Monitor for email campaigns that boost the bottom line.

Get started for free