Issue with GMail - Wrapping up Html email with unwanted PRE tag

Question

I am trying to send HTML email to GMail. But GMail is internally wrapping up Html of my email with pre tag.

For ex: my email contains below html

<html>
<body>
    <table>
        <tr>
            <td> TEST 1 </td>
        <tr> 
    </table>
    <table>
        <tr>
            <td> TEST 2 </td>
        <tr> 
    </table>

</body>

But Gmail translates this html in different way as shown below

<pre><table>
        <tr>
        <td> TEST 1 </td>
    <tr> 
</table>
<table>
    <tr>
        <td> TEST 2 </td>
    <tr> 
</table></pre>

Can anyone help me, how does this PRE tag gets added in GMail?
The problem with this pre tag is that it has got some styles coming up from gmail that breaks the look and feel of my email. Below is the CSS.

.gs pre {
  white-space: pre-wrap;
}

Also, Is there a way to override the above CSS to change the value of 'white-space' to 'initial' instead of 'pre-wrap'? If this is possible, my issue will be resolved.

Any help on my above doubts is really appreciated.

That's incorrect, Gmail doesn't wrap `table` with `pre`. – rds Mar 28 '15 at 12:10 — rds, Mar 28 '15 at 12:10

score 5 · Accepted Answer · answered Mar 28 '15 at 13:04

@RDE, You are absolutely right. Gmail does not wraps PRE tag.

I just figured out the problem and the solution too.

Issue I was using Adobe CQ(content management tool) to send emails. While sending emails my entire HTML was wrapping up with PRE tag. This was most probably due to Adobe CQ Mail API that sends email. Issue occurred for me in all email clients.

Solution I have wrapped PRE tag outside entire html with style "white-space:initial". When CQ generates email, I get two pre tags now, one(outer PRE tag) from CQ and another one(Inner PRE tag) which i used to wrap my HTML. The inner PRE tag took the priority over outer one and overrides the styles which were causing the issue. Adding the code for better clarity

<pre style="white-space:initial"> 
Your hTML that goes through CQ
</pre>...

Now once you send email through CQ your final html will be like this

<pre>
    <pre style="white-space:initial">
        Your hTML that goes through CQ
    </pre>
</pre>

Incredible, but this actually solved my issue, mine was completely different happening in outlook desktop web app. My email wasn't containing the paragraph text inside the table container. Funky enough, I found out that it had a
tag, in which if I removed it, it wrapped everything correctly. So I added a second pre to it, and boom, it worked, thanks so much ! — Leo, Nov 12 '18 at 14:18

Issue with GMail - Wrapping up Html email with unwanted PRE tag

1 Answers1