css - problems with negative margin in mail template
Solution 1
Most of the Email clients dont support negative margin. You will have to take that ribbon image as a background.
Solution 2
As of Jan. 2015, gmail's web client ignores negative margin.
Solution 3
Apparently, as of Jan. 2022, Gmail's web client still ignores negative margin
neo
I'm 25, I have BC in Information Technology, I'm interested in new and exciting technologies, I'm literally a patrol-head and also I'm very interested in some boring stuff like politics, sociology, philosophy and so on. Currently I work as junior front-end web application developer and freelance stuff.
Updated on June 04, 2022Comments
-
neo almost 2 years
I'm creating a html mail template, I used a ribbon so I need to a move it a little bit past border. you can see the code here: http://jsfiddle.net/GEqk7/
To do this first i used
position: relative;
and I gave the ribbons a negative position but the thing is thatposition
is not well supported by gmail and yahoo and ... . So I decided to use negative margin but it looks like gmail and yahoo don't support that either.is there a way or a fallback to to do this?
-
usernolongerregistered over 10 yearsYou should really classify your elements and use CSS to organize your formatting. That fiddle is scary. (Very fitting for Halloween)
-
neo over 10 years@Agony sorry :D mail agents just support inline css so I had to make it look like this, Happy Halloween by the way :D
-