Child selector has been used by web developers to hide many different CSS commands (tags) from Internet Explorer. This technique is only possible in I.E 6. Since IE 7 recognizes the child selector, the same is not possible with this version. You might have a question –What actually the child selector is? Let’s find out with an example:
<div> <p> <span> Your text </span> </p> </div>
In this example, the <div> has a child <p> and <span> is grand-child of <div>. The content in the <span> tag can be made green by using this CSS pattern:
div span {color: green;}
The above code will make the text in <span> green when the <span> tag is nested inside a <div>. Similarly, <span> tag could become a child, grand-child or great grand-child of <div> tag.
Similarly, rules can be assigned to every HTML tag that is a child of another tag. Let us understand it further - for example, you want to assign a top margin to the first <div> tag and not to others. Without using a child selector, we’ll be pushed to assign an id or a class to the <div> tag and then reference that id or class in the CSS command.