How can I add inline media queries in style tag in inline?
<td class="width-33 content-cell" align="left" style="width: 33.33%; padding: 30px 0px; padding-bottom: 0px;">
I want to use a media query in this tag then how can I?
Asked
Active
Viewed 1.1k times
3
Hemangi Satasiya
- 53
- 1
- 2
- 8
2 Answers
2
No, the right way to add @media queries is to use them in a CSS file rather than using them as an inline styling.
Media queries need a selector to work with. The better way would be to inject a <style></style> tag and declare your media queries there.
Read this for reference Is it possible to put CSS @media rules inline?.
samuellawrentz
- 1,662
- 11
- 23
-
But when I forward this mail then that media queries were not working. so I want to add into inline – Hemangi Satasiya Jul 09 '18 at 06:18
-
https://www.emailonacid.com/blog/article/email-development/media_queries_in_html_emails/ WIll this help? – samuellawrentz Jul 09 '18 at 06:28
-
Only a few clients support media queries, that may be a reason for why it didn't work @HemangiSatasiya – samuellawrentz Jul 09 '18 at 06:32
-
1That list is 6 years old and obsolete. – Syfer Jul 09 '18 at 11:28
1
Just like Samuellawrentz said media queries are not possible inline, it has to be in style for it to work.
<style>
@media ...
</style>
The best and most recent collection of CSS that work in an email can be found at campaign monitor's blog.
Since you are after media queries, its supported by roughly 95% of the email clients now. Find the most recent list here.
Syfer
- 4,262
- 3
- 20
- 37
-
In normal email template, it's working fine but when you forward that particular email styling can't apply if it's not inline. – Hemangi Satasiya Jul 10 '18 at 05:25
-
1Forwarding will always break emails specially in Outlook as it adds it's own code before composing. You can have a forward link on emails which takes you to a page to forward to a friend or you can go with a broken email when it's forwarded. It's harsh I know but there is no way around it. – Syfer Jul 10 '18 at 05:36