CODEWITHSUNDEEP
javascriptjqueryhtmlcss
SH.Developer
SH.Developer

Reputation: 187

fix div when window resize

I have a div that has fixed position and bottom 0 to display at the bottom of the window.

My problem is when window resize, this div move to up and into other elements. For example when I open console box in chrome this div jump to other elements in facebook fix position such as friend list, when I open console box, element jump to up but hidden up element.

Please help me how I can fix div in window resize.

Upvotes: 0

Views: 2386

Answers (2)

Anonymous
Anonymous

Reputation: 10216

CSS Position Fixed:

Do not leave space for the element. Instead, position it at a specified position relative to the screen's viewport and doesn't move when scrolled. When printing, position it at that fixed position on every page. Fixed positioning is similar to absolute positioning, with the exception that the element's containing block is the viewport. This is often used to create a floating element that stays in the same position even after scrolling the page. - by Mozilla MDN

In other words, When you use position: fixed; that takes elements out of the document's regular flow.

How I can fix div in Window Re-size?

Solution: There's no way to do it as you want using CSS. You must remove position: fixed; because when you set bottom: 0px with position: fixed; to your element then it doesn't matter that what is the size (vertical) of your browser or window because position: fixed; element will always appear on the bottom of the viewport screen at 0px.

Upvotes: 1

user3561203
user3561203

Reputation: 29

You can use position: fixed or

`position:absolute`

Upvotes: 0

Related Questions