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; } 

demo

the !important needed override position:relative of popmenu.js plugin.


Comments

Popular posts from this blog

angularjs - ADAL JS Angular- WebAPI add a new role claim to the token -

php - CakePHP HttpSockets send array of paramms -

node.js - Using Node without global install -