"Bring inline"

[jelmerdemaat]

Hi,

I just started using your email template and it gives some great advises (to me as a novice).
There is however a notion to "bring inline" certain styles, which confuses me.

Does this mean that, for example, you have to copy the standard styles for images to each instance of an image in the email?
And for each h1, h2, h3... table, and so on?
Or do I have to move the <style> block to be inside the ?

Either way, maybe the action to "bring inline" styles could be explained in more detail in the template?
It could be due to the fact that I'm a non-native English speaker as well.

Cheers,

Jelmer

[jelmerdemaat]

I don't know why the HTML tags in the previous message appeared, but I guess the question is clear. :)

[cssagogo]

No it is confusing. The documentation contains... "INLINE: Yes.", "Bring inline: Yes.", "Bring inline: No." and " Don't bring anything below this line inline." I'm not sure if each has its own meaning or if the same things are just being restated in different ways. I know what to do with the "Bring inline: Yes" stuff, but I don't know what to do with the rest. Should it be an embedded style sheet? If so should it be contained in the head or just inside the body?

[emilchristensen]

The stuff that does not have "Bring inline: Yes" should just be left in the <style>-block in the head.

[rickpastoor]

Would be great to update the boilerplate template and straight this out. For example this part:

/* Some sensible defaults for images
1. "-ms-interpolation-mode: bicubic" works to help ie properly resize images in IE. (if you are resizing them using the width and height attributes)
2. "border:none" removes border when linking images.
3. Updated the common Gmail/Hotmail image display fix: Gmail and Hotmail unwantedly adds in an extra space below images when using non IE browsers. You may not always want all of your images to be block elements. Apply the "image_fix" class to any image you need to fix.

Bring inline: Yes.
*/
img {outline:none; text-decoration:none; -ms-interpolation-mode: bicubic;}
a img {border:none;}
.image_fix {display:block;}

Should I bring .image_fix inline? If so, why declare a class for it? Might be a better idea to add sample blocks of content to the body with all styles attached (for example a normal image, an image with a link, etc.)