css3 - CSS Select div whose immediate sibling is NOT p -


this question has answer here:

i have situation:

the transition on entering is, after 1sec delay, fade-in 100% opacity:

transition: opacity 1s ease 1s; 

the transition on leaving is, within 1sec fade out 0% opacity:

transition: opacity 1s; 

the .leaving element removed after 1second. after removed want position:static on .entering

so in other words: "when .entering not followed .leaving, apply position:static" , "when .entering followed .leaving should position:absolute"

i'm trying this

.entering { position: absolute; }  .entering:not(+ .leaving) { position: static; } 

however not working. ideas?

let's example in simplified case, background colors. if .entering followed .leaving, it's background color should red. if .entering followed non-.leaving (or followed nothing), background color should green.

for instance:

and when not followed leaving:

i tried color case here in fiddle - https://jsfiddle.net/noitidart/7utx2uwc/

<style> .entering { background-color:red; } .entering:not(.entering + .leaving) { background-color:green; } </style>  <div class="entering">entering</div> <div class="leaving">leaving</div> 

please change ordering of both divs , use css style them:

html

<div class="leaving">leaving</div> <div class="entering">entering</div> 

css

.entering {   background-color:red; } .leaving + .entering {   background-color:green; } 

please see demo: https://jsfiddle.net/7utx2uwc/3/


Comments

Popular posts from this blog

get url and add instance to a model with prefilled foreign key :django admin -

css - Make div keyboard-scrollable in jQuery Mobile? -

ruby on rails - Seeing duplicate requests handled with Unicorn -