Skip to content Skip to sidebar Skip to footer

Target Element Right Before Other Element

During my research for this, I stumble upon this thread, but since it is 2 years old, Im wondering if there's a recent way of targeting an element that is right before another. For

Solution 1:

No this is not possible using CSS alone

if your HTML had been structured like below then yes CSS can be used

<divid="thediv"> Target Span From Here Using #thediv </div><span> Element Before Div </span>

for e.g to change the color of the span using the div, you would write as

#thediv + span {
color:blue;
}

this is called adjacent sibling selector.

There is no way in CSS to target a previous element ,but a following element can be targeted like shown above.

Solution 2:

There is indeed actually, no way to select that span.

Level 4 propose this :

    !spanli > div.subdiv {/* would style span if 
                              inside li that has a  
                              div.subdiv  
                              as direct child */}

so we could do as well: !span li > div.subdiv:hover {}.

http://www.w3.org/TR/2013/WD-selectors4-20130502/#subject (maybe i missunderstands subtilities of english) <edit>actually i missed this : http://dev.w3.org/csswg/selectors4/#profiles</edit>

Today,(Apr. 14) there is no way to directly style that span via CSS ,

but CSS can offer some turn around to hide it or change background color for instance.

like this silly test :) http://codepen.io/anon/pen/kxwtB/ over the div and believe that span receive some CSS styling.

Actually i was curious too of what kind of rules you wanted to see modified for the span .

Post a Comment for "Target Element Right Before Other Element"