CMS Development

vytas
Member

Custom CSS does not apply on mobile web GMAIL

SOLVE

Hi all, 

 

custom CSS is not applied to testing email when I try to open on mobile web Gmail.

 

Do you think any specific reason?

 

Here is preview: https://email.carts.guru/?hs_preview=BDCUtvrP-24320579833

 

Image from iOS.png

0 Upvotes
1 Accepted solution
Kevin-C
Solution
Recognized Expert | Partner
Recognized Expert | Partner

Custom CSS does not apply on mobile web GMAIL

SOLVE

@Hey @vytas 

 

I'm guessing here, but the background image issue seems to be that the depreciated background attribute image is too large. This is because your image as you know is @2x. The background attribute doesn't allow you to scale (source) so now your image is twice the dimensions as Gmail wants it to be as, illustrated in the image below:

Asset 7@2x-2-1-1-1.png

 

 

 

Now the text styling is an odd one because everything looks correct to me. This could possibly be caused by load speed, but seems rather unlikely. Might be worth combing through these documents.

 

Edit:

More on the background image size issue

Kevin Cornett - Sr. Solutions Architect @ BridgeRev

View solution in original post

1 Reply 1
Kevin-C
Solution
Recognized Expert | Partner
Recognized Expert | Partner

Custom CSS does not apply on mobile web GMAIL

SOLVE

@Hey @vytas 

 

I'm guessing here, but the background image issue seems to be that the depreciated background attribute image is too large. This is because your image as you know is @2x. The background attribute doesn't allow you to scale (source) so now your image is twice the dimensions as Gmail wants it to be as, illustrated in the image below:

Asset 7@2x-2-1-1-1.png

 

 

 

Now the text styling is an odd one because everything looks correct to me. This could possibly be caused by load speed, but seems rather unlikely. Might be worth combing through these documents.

 

Edit:

More on the background image size issue

Kevin Cornett - Sr. Solutions Architect @ BridgeRev