Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

General Discussion

Cross-Broswer Support IE 7 & 8 using psuedo selectors

I did not understand in the training what he meant by using JQuery as a fix for CSS pseduo selectors.

7 Answers

James Barnett
James Barnett
39,199 Points

Can you link to which video with the approximate time you are referring to.

He says to use the JQuery js library to use these CSS3 selectors because they are not support by IE and older versions. Which selectors specifically does he mean and going to that library what do I look for. In the world of development. It is always necessary to support IE so I think getting more specific about this is of importance. Please advise. What do I search for to solve this issue in the JQuery library?

Here is the website he discusses in the video:

http://www.w3.org/TR/CSS2/selector.html

James Barnett
James Barnett
39,199 Points

@Irene -

To learn about all about CSS I suggest you follow the Learn HTML & CSS Learning Adventure.

Learning Adventures, like Learn HTML & CSS, are guided curriculums that are there to help make sense of your learning experience.

Even if you think you know where to begin, it's highly recommended you follow the Learning Adventure so that you watch the courses in the order in which were designed to be viewed in.

I understand selectors, what I do not understand the mention of Jquery libraries to handle IE7 & 8 which those libraries where CSS is not supported. He does not go into this much.

The following example won't work in IE7 & IE8 because it is a pseudo-selector:

tr:nth-child(odd) {
    background: blue;
}

This gives every odd number of table rows a blue background. To achieve this in IE7 & IE8, you can use jQuery, like so:

$('tr:nth-child(odd)').css({
    "background": "blue"
});

As this jQuery would only need to apply to IE7 & IE8, you can use conditional comments to do just that. So, in the head of your HTML document, you'd do something like this:

<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <!--[if lt IE 9]>
        <script src="ie-fixes.js"></script>
    <![endif]-->
</head>

Anything inside of the conditional comment will only apply to IE browsers less than (lt) version 9.