CODEWITHSUNDEEP
ruby-on-railsemail-templates
roni.radev
roni.radev

Reputation: 46

ruby on rails simple_format adding <br> to bold and italic list items

Whenever we have a list item that starts with bold or italic text and then it has normal text, a
appears just in front of the <strong> or <italic> tag. This happens only if there's a mixture of font-styles. It appears in every single email client.

HTML

<ul><li><strong>bold</strong></li><li><strong>bold </strong>and normal</li><li>normal and <strong>bold</strong></li><li><em>italic</em><strong> </strong>and normal</li><li>normal and <em>italic</em></li><li><strong>bold </strong>and <em>italic</em></li><li><strong><em>bold-italic</em></strong></li></ul>

How it appears in every email client

Email screenshot

This is the code when I inspect the email

markup screenshot

Any suggestions why is that happening?

Upvotes: 1

Views: 1728

Answers (1)

Mattia M.
Mattia M.

Reputation: 484

This isn't a simple_format issue. From what I'm seeing it is due to Chrome html source autocorect.

If you notice, this happens every two <li> tag.

This is because simple_format convert every new line into a <br> tag which is not permitted inside a <ul>. So Chrome corrects that for you and tries to put in the first allowed spot. In your case, inside the next <li> tag.

To be sure, try outputting the result of simple_format(your_text) in the rails console. You should see what the problem is.

Workaround (kind of)

Try to remove all the \n between the <ul> tag and put into a single line, like this:

<ul><li>First</li><li>Second</li><li>Third</li></ul>

Upvotes: 1

Related Questions