0

I want to show hidden container outside label+checkbox. It works when I place both div inside the same div. I want it outside the c6_top_right navtop container, as follows:

CSS:

<style>
#setcart,span.total{cursor:pointer;}
input#setcart{display:none;}
input#setcart:checked + .remove-check{display:none;}
input#setcart:checked + #mycart{display:block;}
#mycart{display:none;position:absolute;top:50px;z-index:99999;background:#111;margin:0;padding:20px;}
.cart_content{color:#fff;}
</style>

HTML:

    <div class="inner">
       <div class='c6_top_right navtop'>
          <label for='setcart'>OPEN</label><input id='setcart' type='checkbox'/>
       </div>
    
       <div id='mycart'>
           <div class='cart_content'>CLICK AGAIN TO CLOSE</div>
       </div>
   </div>

If you find my question 'duplicate', please let me know.

Andrea Saturnus
  • 15
  • 6
  • 1
    This requires you to traverse UP the DOM in order to select the required element afterwards which requires a parent selector which does not exist. There are work arounds for which see the linked duplicate. – Paulie_D Jun 18 '23 at 05:02

0 Answers0