I am experiencing an issue with a div that is positioned absolutely at the bottom left of my website. When I open the site in a new tab using
<a target="_blank" href="./index.html">
, the bottom value is not being applied correctly.
<style>
.mybox{
width: 150px;
height: 200px;
background-color: red;
position: absolute;
bottom: 70px;
left: 30px;
}
</style>
<a href="./index.html" target="_blank">Click me</a>
<div class="mybox"></div>
Here is the link to the demo: .
To reproduce the issue, follow these steps:
- Open the link on an iPhone using Chrome.
- You will see a red box at the bottom of the screen (which is correct).
- Click on the
clickme
button at the top left corner, which will redirect you to the same site in a new tab. - Now, you will notice that the red box is below the bottom of the screen (this is the issue).
Thank you.