Does Outlook Mobile have its own unique conditional CSS statement?

As I work on designing an emailer, I have encountered some challenges with Outlook. To address this issue, I created specific styles for Outlook (desktop) that have been effective for me. The code snippet I am using to apply these Outlook styles is:

<!--[if (gte mso 9)|(IE)]> html/css styles here <!--<![endif]-->

I also need to filter them accordingly:

<!--[if !mso]> html/css styles here <!--<![endif]-->

However, the challenge now lies in targeting Outlook Mobile specifically. How can I achieve this? For example:

<!--[if (!mso) | (.outlook-mobile-only) ]>

It appears that Outlook Mobile may not be recognizing the !mso statement as intended, leading to it ignoring my mobile-specific styles.

htmlcssemailoutlook

Answer №1

A negative answer followed by an affirmative one.

There is no specific targeting of Outlook Mobile in this context. Furthermore, it is worth noting that Outlook desktop generally does not interpret @media queries.

@media queries are not utilized by Outlook for Android. While Outlook for Mac does support them, many versions of Outlook do not function well with @media queries.

If you require more information, feel free to visit:

Additionally, a helpful resource can be found at:

Best of luck on your endeavors.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to align the action buttons on this webpage?

I'm struggling to center both buttons on the page. I've tried using margin:0 auto 0 auto; in the position property, but it doesn't seem to work. Strangely, when I used a table instead of a div, it worked. I'm curious to know why I can&a ...

htmlcssbootstrap-4css-positioncenter

Collecting pieces of documentation during the rendering process with pug

When creating HTML email messages from a template using pug, I encounter some challenges. For instance, I retrieve the subject of the email from the title element in the generated HTML. However, the current method of parsing the HTML document doesn't ...

node.jsemailpug

The div iframe is not showing up within the HTML document

The code snippet below shows a div with the left side displaying correctly, but the right side within an iframe is appearing outside of the boundary of the div. The content on the right is positioned at the top instead of being displayed within the space o ...

javascriptjqueryhtmlcssiframe

Designing an accordion with the main content peeking out slightly before collapsing into place

Seeking assistance in creating an accordion that displays a snippet of content before collapsing. I'm facing difficulty starting this project. While a basic accordion is simple to implement, I am unsure how to show a portion of the content (such as t ...

javascripthtmlcssbootstrap-4accordion

Guide on utilizing regular expressions to match CSS selectors

Attempting to determine if the head section in jQuery contains the font-weight:bold property within CSS. That particular property may exist in 4 different variations: font-weight:bold font-weight: bold font-weight :bold font-weight : bold Is there a way ...

cssregex

Refresh choices for the user interface selection menu

I've successfully mastered the art of redefining options for Webix ui.richselect/ui.combo. The technique involves: richselect.getList().clearAll(); richselect.getList().parse(options_data) Now, I'm facing a challenge with changing options fo ...

javascripthtmlhtml-selectwebix

What is the best way to prevent text from being edited in an HTML document?

Hello, I'm trying to find a way to stop users from altering text on my website. I am aware of the 'readonly' and 'disabled' attributes, but they can be bypassed by using the 'inspect element' feature in the browser. Any ...

htmlcss

Utilizing Stylus: Embracing Interpolation within a Mixin

I am encountering an issue while attempting to interpolate values passed into a mixin. positionModifier( key, x, y) &.{key} background-position: {x}px {y}px; An error is being thrown, which is shown below: 351| positionModifie ...

cssstylus

Design an unordered list containing a text input field and a clickable button

I need assistance with creating a feature where text input is converted into a list when a button is clicked. Here's what I currently have: <!doctype html> <html> <head> <meta charset="UTF-8"> <title>3-2</title> & ...

javascripthtml

What is the best way to retrieve text that is viewable to the user when there is a text overflow situation

When using ellipsis in a text input to indicate overflow, is there a way to determine what text is visible to the user versus hidden behind the ellipsis? Thank you for any help! https://i.stack.imgur.com/8iLBQ.png In my scenario, I need to display a list ...

htmljquerycssweb

Selecting the perfect default font using font-display: fallback

When I use a particular font and find that its loading time is too high, I want to set a default font. So I experimented with the following code: font-display: fallback; It seems to be working fine (although I haven't checked compatibilities yet), ...

css

What is the best way to "re-upload" drop-down selection using javascript?

I am attempting to automate a drop-down selection process on a website using a headless browser called Firefox Marionette. The website is not under my control, and the process involves: A primary drop-down menu where I can choose an option. A secondary dr ...

javascripthtml

Splitting with Regex - One Time Operation

Here is some of my Jquery code along with Regex: $("[class^=ipsum-img],[class^=ipsum-img-]").each(function(){ var x = $(this).attr("class"); console.log(x.length); if (x.length>8) { var m = x.split(/(\d+)[^-]*$/g); cons ...

javascriptjqueryhtmlregex

Numerous intersecting lines on display within Google Maps

Currently, I am working on displaying multiple flight routes on Google Maps. I have implemented polylines with geodesic to achieve this functionality successfully. However, a challenge arises when more than two flights intersect the same route, causing o ...

javascriptjqueryhtmlgoogle-mapsgoogle-maps-api-3

Is there a way to iterate through identical sections of HTML using BeautifulSoup?

Looking to extract information from each of the "item watching" elements within the "items" class. Currently facing a challenge where using the find method only retrieves HTML for the first occurrence of "item watching". Aiming to avoid utilizing find_all ...

pythonhtmlbeautifulsoup

What is causing this unexpected text to display in Django when encountering errors while trying to submit a form?

On my website, there is a form that collects an employee number and validates it against another model called Salesman. It also checks if the employee's team field includes 'WF'. The validation process functions correctly and displays everyt ...

pythonhtmldjangodjango-forms

Eliminate the curved edges from the <select> tag

Is there a way to eliminate the rounded corners on a select element? I attempted using the code below, but it resulted in removing the arrows and cutting off the bottom of the placeholder text: select { -webkit-appearance: none; -webkit-border-radius ...

jquerycss

Conceal the ::before pseudo-element when the active item is hovered over

Here is the code snippet I am working with: <nav> <ul> <li><a href="javascript:void(0)" class="menuitem active">see all projects</a></li> <li><a href="javascript:void(0)" class="menuitem"> ...

javascriptjqueryhtmlcss

Modify the alignment of buttons in a form by adding or removing them dynamically

I need some help with aligning my small form properly. It seems to be misaligned and messy, especially when I click on the plus button. The issues I'm facing are: The blue content on the right side expands vertically causing extra space. I want it to ...

htmlcssbootstrap-4

Tips for adjusting the width of a div based on a variable

I'm working on an editable table and I need to dynamically adjust the width of a div whenever the content in a td changes. It seems like my jQuery code isn't doing the trick. Any suggestions on how to fix this issue? var form = document ...

javascriptjquerycss