Kiti Kiti - 2 months ago 7
CSS Question

(CSS) How to position the Div near to the bottom right corner of the browser Relatively to the Browser Size?

Look at this image:

enter image description here

I want to use a div to create a dialogbox that is near to the bottom right corner of the browser. The footer is fixed & its height is 50px & the dialogbox Div will lie right on top of the footer & to the bottom right corner of the browser as showed in the picture.

Note: the requirement is that that Div must be in that desired position relatively to the browser size. It means that when users shrink to extend the browser the div will be moved as well, but no matter how the div was moved, it should be always in that desired position as showed in the picture.

So, how can I do that in CSS?

Answer

If you want the element to stick regardless of scroll, use position: fixed:

{
    position: fixed;
    bottom: 50px;
    right: 0;
}
Comments