我有一个绝对定位的容器，设置为在屏幕右侧。当我点击某个按钮时，它从右边滑入显示内容。当您单击关闭按钮时，它会滑回屏幕右侧并再次隐藏。它在桌面上运行良好，但是在移动设备上它并没有隐藏在屏幕的一侧，而是将主要内容缩小到宽度的一半，并在其旁边显示绝对定位的元素。当我单击使其滑入的按钮时，容器会变满，它后面的主要内容也会变满。当我单击关闭按钮时，容器不会滑出屏幕，而是向右滑动，两个容器都占据屏幕宽度的一半。
这是html结构和相关的css
html {
width: 100vw;
overflow: hidden;
}
body {
background-image: url(./images/sand.jpg);
background-size: cover;
background-repeat: no-repeat;
margin: 0;
height: 100%;
overflow: hidden;
}
.holder {
transition: all 1s ease-in-out;
}
.work-holder {
position: absolute;
height: 100%;
width: 96%;
background-color: #fff;
overflow: scroll;
transition: all 1.2s ease-in-out;
right: -100%;
color: #616161;
font-family: 'Arsenal', sans-serif;
line-height: 1.5;
padding-bottom: 65px;
}<body>
<div class="holder"></div>
<div class="work-holder"></div>
</body>这是网站的链接，我不确定我是否可以放这个，但如果你在手机上看它，你就会明白我在说什么。它是“工作”容器。 https://linx97.github.io/portfolio/
最佳答案
代替
右:-100%
放
左:-100%；
这会将整个 block 推到手机屏幕宽度的左侧 100%
关于html - 如何让绝对定位的div在手机上离开屏幕，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57961987/