Select the preceding sibling of an element in CSS using selectors

Possible Duplicate:
CSS previous sibling selector

How to select the above element of an element in CSS using selectors

<li class="content">One</li>
<li class="content">Two</li>
<li class="content">Three</li>
<li class="no-content">First</li>
<li class="content">Four</li>
<li class="content">Five</li>
<li class="content">Six</li>

Here I want to use the class no-content, so that I can get its above element <li class="content">Three</li>, using CSS selector.

2012-04-04 06:56
by Justin John

Unfortunately I don't think that's possible yet. Same question: http://stackoverflow.com/questions/1817792/css-previous-sibling-selector Edit: If JS is an option it's obviously quite easy: $('li.no-content').prev().addClass('prev')powerbuoy 2012-04-04 06:58

Rather than “above”, the term for the <li> before <li class="no-content"> is “preceding sibling” - Paul D. Waite 2012-04-04 07:20

This is not possible with pure CSS...

2012-04-04 07:00
by Gatekeeper

2017 - this is possible, see this fiddle I made. https://jsfiddle.net/maxshuty/cj55y33p/3 - maxshuty 2017-06-15 12:23

@maxshuty your fiddle demonstrates the general sibling combinator, only finding siblings listed after the target! In fact, if you take out all the .top css (including the ~s you have used) the fiddle works the same! You have over complicated a wrong answer - Mike 2017-10-03 21:44

Are you looking the same:- http://jsfiddle.net/rohitazad/4Y9D5/3/

you can select to bottom div but not select to top .

2012-04-04 07:10
by Rohit Azad

Please check http://jsfiddle.net/4Y9D5/2/, Here I am just add a class to above element, actually it is not possible, but need like.. - Justin John 2012-04-04 07:24

Hi you are select to bottom div as like this http://jsfiddle.net/rohitazad/4Y9D5/3 - Rohit Azad 2012-04-04 07:25

No, please check link that I have already given. I need like that, but without adding the class to preceding sibling, I want to select the preceding sibling using selector no-content.. - Justin John 2012-04-04 07:32

now check to this you may define .test backgroundcolor as like this http://jsfiddle.net/rohitazad/4Y9D5/8 - Rohit Azad 2012-04-04 07:37

I can't write class test there, its only for you to understand what I need. Is it possible to select the test class node to be selected with the class no-content.. - Justin John 2012-04-04 08:01