Home/ Questions/Q 8453065
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-10T11:40:18+00:00

I have an html page with a z indexed dropdown menu. I have this

  • 0

I have an html page with a z indexed dropdown menu. I have this dropdown menu positioned absolutely.
with some given left and top values. The problem is the dropdown menu is at its place when the window is full screen but when the window is changed in size ( made lesser than the pc window the z indexed element shifts in position which makes it look awkward. I know it is due to absolute positioning.

can anybody please tell me how to fix this ? how to make the dropdown stay always in place. attached is the image.
dropdown

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Make sure that the containing element has ‘position: relative;’ set on it, the top / left values are based on the first containing element with a position set. If the containing element does not have a position set, it will try the next parent, and so on until it finally defaults to the body.

    Here’s an example:

    http://jsfiddle.net/erinfreeman/AHWS2/

    div with the id of ‘one’ has position relative, so the child div bases its bottom / right co-ordinates from that. the div with id of ‘two’ doesn’t have position set so the child div goes to the next parent

    • 0