Can media queries be used in Outlook (all versions). I'm trying to style a div
when at 640px, but Outlook does not seem to fire the styling.
Any ideas?
Advanced targeting. Many email designers will only use media queries in email to adjust styles for mobile devices, but they can be used in more advanced ways, too. For example, there are a lot of coding and design techniques that simply don't work in some email clients.
Use Advanced Query Search (AQS) to refine your search results. In the search box, type an AQS keyword from the table below, followed by a colon and what you want to search for. For example, to find messages with a subject that contains “report,” enter subject:report in the Search box in the Outlook.com beta.
Media queries are useful when you want to modify your site or app depending on a device's general type (such as print vs. screen) or specific characteristics and parameters (such as screen resolution or browser viewport width).
And even though media queries are still a valid tool to create responsive interfaces, there are many situations where it's possible to avoid using width at all. Modern CSS allow us to create flexible layouts with CSS grid and flex that adapts our content to the viewport size without a need to add breakpoints.
Outlook does not really have any solid support for media queries unfortunately and is often 'left out' when it comes to mobile responsive emails.
This link here should help in explaining email responsivity and gives you a good amount of detail.
It's worth noting that versions of Outlook that do not support media queries are not mobile anyhow. Mobile versions of Outlook (iOS and Android) of Outlook do support media queries.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With