-1

I defined a jump up button so that one comes at the button, he can go back to the top of the screen without scrolling top. But it has placed exactly at the middle of the screen. I want it to be at the right bottom and appears when one goes down to the screen.

Farid Hosseini Maram
  • 1
  • 1

1 Answers1

0

It'll be a lot easier to answer this if you posted your code along with the question.
There are a few ways you can try to achieve this and their usefulness might vary depending on other thing you're doing in your web page.
First, if you're sure that your content will exceed the window's length just place the button at the very bottom the body element and and wrap in a<div> with text-align: right. CSS:

.btn {
  text-align: right;
}

HTML:

<div class="btn">
  <button>Scroll up</button>
</div>

If you're not sure about the length of your content you can try the following approach: Use position: relative on a container that wraps your entire page and height: 100vh to make sure it fills up the entire view port. And then use position: absolute for the button to stick to the bottom-right corner.
This is the CSS:

.container {
  position: relative;
  height: 100vh;
}

button {
  position: absolute;
  bottom: 0;
  right: 0;
}

And this is the HTML:

<div class="container">
  <div>
    <!-- all your content -->
  </div>
  <button>Scroll to top!</button>
</div>

If these do not help you please post your code (HTML and CSS) so it'll be easier to help you.
Good luck!

OPearl
  • 349
  • 3
  • 14