javascript - Overlapping a UL tag on a DIV -
i not pro in css. tried whatever can in knowledge. html:
<div id="demo_box"> <div id="pop_ctrl"><i class="fa fa-bars"></i></div> <ul id="demo_ul"> <li class="demo_li"> <div><i class="fa fa-home"></i></div> <div>home</div> </li> <li class="demo_li"> <div><i class="fa fa-cloud"></i></div> <div>cloud</div> </li> <li class="demo_li"> <div><i class="fa fa-cog"></i></div> <div>settings</div> </li> <li class="demo_li"> <div><i class="fa fa-envelope"></i></div> <div>e-mail</div> </li> <li class="demo_li"> <div><i class="fa fa-clock-o"></i></div> <div>clock</div> </li> <li class="demo_li"> <div><i class="fa fa-folder"></i></div> <div>files</div> </li> <li class="demo_li"> <div><i class="fa fa-heart-o"></i></div> <div>favourites</div> </li> <li class="demo_li"> <div><i class="fa fa-mobile"></i></div> <div>mobile</div> </li> <li class="demo_li"> <div><i class="fa fa-power-off"></i></div> <div>exit</div> </li> </ul> </div> hello
i want display ul menu on content below. in example "hello". "hello" shifts down when menu opened. tried examples of other questions not working. can find complete code at: https://jsfiddle.net/o8x59caz/
use position:absolute
top
#demo_ul{ position:absolute !important; top:0; margin: 0px; }
the !important
needed override position:relative
of popmenu.js
plugin.
Comments
Post a Comment