How do you stop a dropdown menu from going up?

Question

I have a dropdown menu that's towards the top of the page for most screen sizes, but on smaller screens, such as a laptop, the menu is in the middle of the screen, and because of this, the dropdown list is going above the selector. I want a dropdown that will consistently go down, no matter where on the page it is. Is this at all possible?

Answer 1

Drop-downs are rendered by the Browser/OS. You cannot control this type of behaviour using CSS or JavaScript.

Answer 2

As it's an element left to the browser to render, no, it's not possible (at least not as far as standards are concerned).

Your best option is to use an HTML substitute for the dropdown menu - this can be achieved with CSS and Javascript, though multiple javascript/jQuery libraries alread exist to perform this task.