display:none doesn't work on Outlook 2007

Question

I want to send an e-mail from our system to customers, where some tags should be hidden to them. I\'ve set the following CSS:

.hidden { display: none; }


        

Answer 1

The only working solution I've found is to use conditional formatting in the HTML source :

<!--[if !mso 9]><!-->
<div>This block of code will display <b>everywhere</b> except in Outlook 2007.</div>
<!--<![endif]-->

Answer 2

Use mso-hide:all in a span surrounding the content, and on any other tags within the span.

Answer 3

Outlook 2007 uses the Microsoft Word engine for rendering HTML which has very limited support for CSS. This page describes the kind of things you can expect to work (display is one of the "not supported" ones).

Unfortunately, there's not much you can do. You can enclose the element in HTML comments <!-- ... --> which would stop it from rendering, but that's about it.

Answer 4

<p style="color:#ffffff;width:0px;height:0px;display:none"> 
<!--[if !mso]><!-->
<p style="color:#ffffff;width:0px;height:0px;display:none !important;">
<!--<![endif]-->
I am not showing !!!
</p>

This works for me !

Answer 5

Outlook 2007 has limited support for CSS and HTML. Read this article for more information.

If class-based CSS rules don't work, try ID-based CSS rules. Just try to keep your rules as simple as possible.

You can use this tool to validate your HTML and CSS for use in Outlook 2007.

Answer 6

Try this — maybe it will work for you.

.hidden{visibility: hidden;}