What is the best way to deal with a list of options when selecting a dropdown that is very close to the end of the browser?

I have considered using a fly out but we actually do not use this type of pattern and I don't think it is best to create one pattern to support one specific occasion.

I also have considered shifting view up for users but decide to go against it for more obvious reasons.

Is there a good solution to this type of occasion or is there another way to solve this more elegantly?

The content is to select country names. The scroll is user controlled. Therefore, this would happen if a user scrolls the form to reveal the dropdown and decide to interact with it.

1 Answer 1


I reckon by 'the end of the browser' you mean 'the fold' - the bottom edge of the view.

The standard solution for this is to display to popout above the field. Many common JQuery popups do this automatically. Here's Select2, for example (which also change position based on scroll - neat):

A dropdown showing below the field

A dropdown showing above the field

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.