CODEWITHSUNDEEP
htmlcss
Vortic
Vortic

Reputation: 75

Fixed elements are out of browser's screen

I have two position: fixed; divs. Everything works fine until I zoom up the page. Normally when you zoom up page two sliders appear that allow you to see the rest of the page that is out of your screen. However, for some reason if those two divs that have fixed position are out of screen the browser doesn't allow to scroll to them.

This doesn't happen if the divs don't have fixed position. Is there ANY solution besides changing position to relative?

Upvotes: 0

Views: 1603

Answers (1)

Mr Lister
Mr Lister

Reputation: 46579

Fixed positioning means that the element is on a fixed position on the screen, no matter if you scroll or not.
In other words, the scrollbars (if any) won't have an effect on the fixed element.
So even if a browser would put scrollbars on the window if the fixed element came out larger, using those scrollbars would not scroll the fixed element into view!
So, no scrollbars. They would be useless.

One solution is to use position: absolute instead of position: fixed. Absolutely positioned elements do scroll with the page, so the scrollbars do work.

<div style="position: absolute; margin-left: 50px; margin-top: 50px; width: 300px; height: 300px; background-color: blue;">


</div>

Upvotes: 3

Related Questions