Drop down menu pushing content down the page

  • beautyfiend
  • Newbie
  • Newbie
  • beautyfiend
  • Posts: 8
  • Loc: London

Post 3+ Months Ago

Hello,
I have created a drop down menu and when it drops down it is pushing the contents below it down the page. Even if I leave a gap big enough for it to expand.
Is there a way of stopping this?
Thank you!
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • AaliyahRoma
  • Born
  • Born
  • AaliyahRoma
  • Posts: 4

Post 3+ Months Ago

beautyfiend wrote:
Hello,
I have created a drop down menu and when it drops down it is pushing the contents below it down the page. Even if I leave a gap big enough for it to expand.
Is there a way of stopping this?
Thank you!


Use position:absolute in your style code or look at these menus: pure css menus
  • narendras83
  • Newbie
  • Newbie
  • narendras83
  • Posts: 5

Post 3+ Months Ago

the problem is you've floated the menu items, including the menu items that appear on hover. Once the hover effect kicks in, all the rules associated with float apply, including the fact that the inline text boxes of float adjacent elements will wrap around the float. Which is what your content is doing as the menu items drop.

Most drop menus use absolute positioning to place the drop down list items beneath the menu for this very reason. Abs pos elements are completely out of the flow and cannot influence other elements in this way.
  • beautyfiend
  • Newbie
  • Newbie
  • beautyfiend
  • Posts: 8
  • Loc: London

Post 3+ Months Ago

Thank you!

Post Information

  • Total Posts in this topic: 4 posts
  • Users browsing this forum: No registered users and 42 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
cron
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.