Question

117

Move div with fixed position if window size changes

rated 0 times [ 123] [ 6] / answers: 1 / hits: 16826 / 12 Years ago, wed, december 19, 2012, 12:00:00

How can i do the following:
I need a div to change it's position when the page is opened on a narrow screen or browser window size is changed.
The fixed div should stay on the same vertical position when the page is scrolled up or down, but i also need it to be lets say 10px away from the largest div(a container for smaller divs, see the picture please). Now when i resize the window the fixed div comes over the div to the right.

So the question is how can i make this fixed div stay on the same position when scrolling the page vertically and make it always be 10px away from the right div? Css class for fixed is:

.fixed{

    width:40px;

    height:40px;

    position:fixed;

    bottom:100px;

    left:100px;

    text-indent:-9999px;

}

In fact i'm trying to implement a back to top button, so the fixed div is this button and the largest div is page's content.

Here is what i have now:

enter

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

iselauniquef

Add To Favorites

Follow

Total Points: 443

Total Questions: 98

Total Answers: 102

Location: Saint Vincent and the Grenadines

Member since Thu, Oct 15, 2020

4 Years ago

answered 12 Years ago jackelyn · Accepted Answer

change your css to make it look like this:

.fixed{

    width:40px;

    height:40px;

    position:fixed;

    bottom:100px;

    left:50%;

    margin-left: -[(maincontainerwidth/2) + 50];

    text-indent:-9999px;

}