Solution for IE6 does not support first child

web front end fifteen thousand three hundred and forty-six 12 years ago (2012-06-18)

The website of Oolong Cat was just launched yesterday, and later IE6 In the smart floating of the sidebar, the margin top of the first module is not 0. The style originally defined in CSS is:

HTML:

<div class="sidebar_block"></div>

CSS:

.sidebar_block:first-child { margin:0; }

It is not the first time that IE6 does not support the first child pseudo class. Usually, we use jquery to solve this problem. Just use the following sentence: $(. sidebar_block: first). css(); That's right. Today I found a solution that can be solved with CSS. Why use js when we can solve with CSS.

To make a long story short, let's get down to business and let IE6 support the CSS code of the first child pseudo class as follows:

.sidebar_block { * margin-top: expression(this.previousSibling==null?'0':'0px'); }

In this way, the top margin of the first class="sidebar_block" DIV becomes 0. A friend will ask, such a sentence of CSS can solve the problem that IE6 does not support first child. How can I write it if I need to use the last child style? Here's how to write last first:

.sidebar_block { * margin-left: expression(this.nextSibling==null?'0':'0px'); }

The above is how CSS implements IE6 to support the first child and last child pseudo classes. If you have any questions, please comment.