CODEWITHSUNDEEP
css
Adrian Preuss
Adrian Preuss

Reputation: 3113

Change parent element in CSS

it its possible to select an parent Element by a specific class?

For an example i have an HTML-List:

<ul>
    <li>Entry 1</li>
    <li>Entry 2</li>
    <li class="selected">Entry 3</li>
    <li>Entry 4</li>
</ul>

All Elements has an bottom border:

ul li {
    border-bottom: 1px solid #FF0000;
}

ul li.selected {
     border-bottom: 1px solid #0000FF;
}

How i can tell over CSS that the color of the previous element is blue? For little example (i know that :previous-child is not valid/exists but it's an little example):

ul li.selected:previous-child {
    border-bottom: 1px solid #0000FF;    
}

Here is an fiddle: http://jsfiddle.net/3W7PQ/

Upvotes: 0

Views: 1128

Answers (1)

Chuck
Chuck

Reputation: 237010

CSS 4 will allow this with the subject indicator, but there's no way in CSS as it exists today to select an element by reference to following elements.

The usual workaround is to have whatever generates your page specify the relationship itself. So, for example, you might have <li class="before-selected"> followed by <li class="selected">.

Upvotes: 1

Related Questions