SitePoint Sponsor

User Tag List

Results 1 to 14 of 14
  1. #1
    SitePoint Zealot
    Join Date
    Dec 2006
    Posts
    137
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Display CSS only for IE

    Is it possible to display a certain piece of CSS code only if IE is not the browser without using Javascript?

  2. #2
    Guru in training bronze trophy SoulScratch's Avatar
    Join Date
    Apr 2006
    Location
    Maryland
    Posts
    1,838
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Conditional Comments.
    Cross browser css bugs

    Dan Schulz you will be missed

  3. #3
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,116
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    yep
    I think the following should work.
    Code:
    <![if !IE]>
    <p>You've made the right choice :)</p>
    <![endif]>
    The difference is the html comments <!-- --> are not completed - so browsers still pick up this piece of code.. but IE looks for this code and chooses to ignore it
    Here is a standard IE conditional
    Code:
    <!--[if IE]>
    <p>Welcome to Internet Explorer 5.</p>
    <![endif]-->

  4. #4
    SitePoint Zealot
    Join Date
    Dec 2006
    Posts
    137
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    When I run this through the CSS validator, it says this isn't valid CSS.

  5. #5
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,116
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    It's HTML not CSS but it's not valid either..

  6. #6
    Non-Member
    Join Date
    Dec 2006
    Location
    Steubenville, Ohio
    Posts
    85
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by RogerZF View Post
    When I run this through the CSS validator, it says this isn't valid CSS.
    That's because it ain't CSS.

  7. #7
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by markbrown4 View Post
    It's HTML not CSS but it's not valid either..
    Why do you say that? As far as I know, it follows all the rules for HTML comments.
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.

  8. #8
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,116
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    Hi Kravvitz,

    I think I just ran it straight through the html validator without anything else so you are probably correct, off to bed now

    I thought a comment had to finish with -->

  9. #9
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It does have to end with -->. The whole thing is one HTML comment. IE5+/Win is just able to pick out part of it and use it like the conditional comment isn't there.
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.

  10. #10
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,116
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    Where is the --> ?
    Code:
    <![if !IE]>
    <p>You've made the right choice :)</p>
    <![endif]>

  11. #11
    SitePoint Wizard holmescreek's Avatar
    Join Date
    Mar 2001
    Location
    Northwest Florida
    Posts
    1,707
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Another thought :

    Code:
    <!--[if lte IE 6]>
        do something here...
    <![endif]-->
    Then again, IE 7.x patch will come along and drop support for conditional statments --

    -----------

    Micro$oft - Give us your money to upgrade to software that is 50&#37; stable, because we no longer support your software that is 95% stable. We do appreciate the patience of Windows users while we have assimilated all the design ideas of Apple, Inc., over the previous 5 years. (It looks good now, but, give us another five years to make it 96% stable - at which time, you will be required to upgrade again).
    intragenesis, llc professional web & graphic design

  12. #12
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,116
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    I think you missed the question holmescreek, the code you supplied would only offer 'do something here...' to IE 6 and below.
    The question was asking how to deliver code to anything but IE

  13. #13
    SitePoint Wizard holmescreek's Avatar
    Join Date
    Mar 2001
    Location
    Northwest Florida
    Posts
    1,707
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yeah, I know what you are pointing out. I was just making it clear, from your previous example, that the original poster shouldn't forget to make a "memory note" that there are lots of things that can be done with the IF statement besides just "!IE"

    just a programmer -- tossing that out there.
    intragenesis, llc professional web & graphic design

  14. #14
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    *sigh* You can't hide part of a stylesheet from IE with all certainty.

    RogerZF, I do know of a method to hide a whole stylesheet from IE, but I'm curious, why do you want to do that?

    Mark, thanks for pointing out that RagerZF's question hadn't been answered. It made me go back and read his question. It's odd that it asks the opposite of what the title says.
    Quote Originally Posted by markbrown4 View Post
    Where is the --> ?
    Code:
    <![if !IE]>
    <p>You've made the right choice :)</p>
    <![endif]>
    You're talking about Downlevel-revealed Conditional Comments, while I was talking about the more common (because they validate) Downlevel-hidden Conditional Comments.
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •