Css in email gets formatted somehow


I’m trying to edit a email in Pinegrow, but when I save this happens to the CSS. I tried shutting off CSS code formatting, but it still gets ugly.
Any advice to solve this is much appreciated!


The CSS code formatting setting says it’s for CSS files, don’t know for sure if it’s also affects CSS formatting inside HTML files. So that setting probably does not have any affect on the HTML file.

You could look at the setting “Auto-format HTML code”, to see if that make any difference.

Are you sure that there are no “syntax errors” somewhere in your code (HTML or CSS code), which Pinegrow maybe can’t handle and lead to this incorrect formatting.

Or maybe because of the XML code at the top. You could try to remove that, instead of have it there as a piece of comment. You could try this, to see if that make any difference.

you are writing CSS rules as inline styles.

are you pasting this text from a .css file into your .html file? or from an email?

seems more like a CR vs LF recognition problem, you might have to paste it to a word processor or code editor as and intermediary to make sure the ends of the lines are correctly set.

@droidgoo Good suggestion, that could be it.

Yes I tried every setting in Pinegrow , but no luck. I’m positive there are no errors in the email it’s a template based on the best email framework I know: https://github.com/ThemeMountain/pine made multiple mails with it last years.

The previous email I edited in Pinegrow was already optimized and the inline HTML and CSS minified that worked without a problem. But a non optimized mail get’s formatted in the wrong way. The HTML seems untouched and the CSS is minified, but with a space between each rule.

I just continue with email editing in Sublime for the moment until I know why Pinegrow behaves like this.

Any email has only inline CSS! There is nothing wrong with the CSS it’s inline unminified.

Using inline styles is not a problem, and that is not what @droidgoo is refering to as a problem. For email templates you have no other choice to use them inline.

He is pointing out that when you got code from outside Pinegrow, copy/paste from another program or external document. It’s very good possible that it has other/different “line endings”.

Even when your CSS syntax is 100% correct, you could still have “line ending” problems.
I would definitly investigate this to be sure!

That was already minified, so NO “line endings” which could give problems.

When they (line endings) are not regonized correctly (because they are different/don’t match the document). Pinegrow could possibly ignore them and end up seeing it as “one line”. Which give minified as a result.

Maybe @matjaz can give more info and explain how Pinegrow is handling different or mixed “line endings”.

Thanks for all answers also droidgoo!

Unfortunately I can’t upload the email, because of the forum restrictions (no html?).