In a HAML doc, I have:
/[if IE] This is IE /[if !IE] This is not IE
The first conditional evaluates properly in IE (and presumably in Firefox and Chrome, as "This is IE" does not render in those browsers). However, The second conditional does not seem to evaluate properly in Firefox or Chrome, as "This is not IE" is not rendered.
I'm guessing I've done something wrong. Any ideas?
Haml Comments: -#The hyphen followed immediately by the pound sign signifies a silent comment. Any text following this isn't rendered in the resulting document at all.
Haml (HTML Abstraction Markup Language) is a templating system that is designed to avoid writing inline code in a web document and make the HTML cleaner.
When using IE conditional comments, there are two different types you need to be aware of. First, when the entire content is inside a HTML comment (between <!--
and -->
), but IE will read it because of the condition:
<!--[if IE]> This is inside a HTML comment, so most browsers will ignore it, but IE will interpret it. <![endif]-->
The other type is not a single comment, but some content that browsers will see, surrounded by two comments that will make IE ignore it:
<!--[if !IE]> --> This is not a HTML comment, so browsers should see it, but IE will ignore it. <!-- <![endif]-->
(SO's code highlighting shows the difference - in the top one everything is grey as it's all comment, but in this one the text is darker as it's not a comment).
The Haml support for IE conditional comments is only useful for creating the first kind, as it is part of the syntax for creating block comments. If you try using it for the second kind (as you have here) you get something like:
<!--[if !IE]> This is inside a HTML comment, so other browsers will ignore it. IE will also ignore it, as the conditional states !IE. So everything ignores it. <![endif]-->
which is effectively an unconditional comment.
In order to use the [if !IE]
type in Haml, you'll probably have to do it manually:
%p Some other content <!--[if !IE]> --> %p Here's some content that shouldn't appear in IE. <!-- <![endif]-->
You could also make use of the Haml surround
helper, like this:
%p Some other content =surround '<!--[if !IE]> -->', '<!-- <![endif]-->' do %p Here's some content that shouldn't appear in IE.
(If you’re using Rails then you’ll need to use html_safe
on the strings, i.e. surround '<!--[if !IE]> -->'.html_safe, '<!-- <![endif]-->'.html_safe do
).
If you're using this a lot, it might be worth creating a helper method that wraps this call to surround
.
for list of conditions:
!!! :plain <!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]--><!--[if IE 7]><html class="no-js lt-ie9 lt-ie8" lang="en"><![endif]--><!--[if IE 8]><html class="no-js lt-ie9" lang="en"> <![endif]--> <!--[if IE 9]><html class="no-js lt-ie10" lang="en"> <![endif]--> <!--[if gt IE 9]><!--> %html.no-js{:lang => 'en'} / <![endif] %head %title Yinlang
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