I'm designing an online form that includes selection of options from combo boxes. The submit button is on a sticky bar at the bottom of the screen.

My question is: should the drop down of a combo box in a form be above or below the sticky bar?

enter image description here

  • What do you mean by sticky? Is the bar fixed to the bottom of the screen at all times?
    – Andy
    Commented Feb 14, 2023 at 12:22
  • @Andy Yes, that's what I mean
    – Blue Ocean
    Commented Feb 15, 2023 at 3:07

2 Answers 2


Quality comboboxes open their list of options depending on the position on the visible viewport. Either to the top or the bottom.

The list also initially has the same width as the input, extending based on the length of their options. Either to the left or the right, again depending on their position on the viewport.

In this case, the combobox would likely open to the top, not interfering with the fixed toolbar on the bottom.

In all cases should the option list be above all other elements in z.


Above the sticky bar (I assume you mean z-axis). Otherwise the sticky bar covers the dropdown, making handling difficult.

Whenever the user opens a dropdown their focus is on it, not on the page as a whole.

  • i agree. however i'm wondering if the user keeps the drop down open and scrolls, will the dropdown move along with the scroll?
    – Blue Ocean
    Commented Jan 20, 2022 at 9:36
  • 1
    Depends on where the mouse cursor is and whether the dropdown itself is scrollable. If it is, and the cursor is within the dropdown, then - of course - the dropdown should be scrolled, the rest of the page remains where it is. If the mouse is outside, the dropbox should move with the content, as it "belongs" to the input field it is attached to.
    – Gerda
    Commented Jan 20, 2022 at 9:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.