How to have the absolutely positioned element be positioned relative to the scroll height of its container using CSS?

Spread the love

Sometimes, we want to have the absolutely positioned element be positioned relative to the scroll height of its container using CSS.

In this article, we’ll look at how to have the absolutely positioned element be positioned relative to the scroll height of its container using CSS.

How to have the absolutely positioned element be positioned relative to the scroll height of its container using CSS?

To have the absolutely positioned element be positioned relative to the scroll height of its container using CSS, we make the element have fixed position.

For instance, we write

#mess {
  position: fixed;
  background-color: black;
  top: 20px;
  right: 50px;
  height: 10px;
  width: 600px;
  z-index: 1000;
}

to add position: fixed; to make the element stay fixed on the screen.

We set its position by setting top and right.

Conclusion

To have the absolutely positioned element be positioned relative to the scroll height of its container using CSS, we make the element have fixed position.

Leave a Reply

Your email address will not be published. Required fields are marked *