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
Post a Comment