无法滚动到页面上方元素的溢出部分
P粉041881924
P粉041881924 2023-08-30 21:41:10
[HTML讨论组]

如果我调整页面大小,元素溢出到视口之上,我无法向上滚动查看它们。我找到了一个带有解决方案的问题,但它没有起作用。我有两个“核心”的不可见div和一个包含所有内容的div元素。

“container” div的存在是因为我试图解决这个问题。

.container {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 500;
}

.main-content {
   display: flex;
   width: 100%;
   height: 100%;
   overflow: auto;
   margin: auto;
}

.window {
   /*height: 16vw;
   width: 27vw;*/
   display: flex;
   height: 550px;
   width: 800px;
   position: absolute;
   top: 50%;
   left: 50%;
   border: solid blue 5px;
   background-color: black;
   margin: auto;
   overflow: hidden;
}
<div class="container">
  <div class="main-content">
    <div class="window" id="window1" style="transform: translate(-10%, -90%);">
      <div class="header" id="window-header">
        <img src="https://picsum.photos/800/550">
        <p class="title">navigation</p>
      </div>
    </div>
  </div>
 </div>

P粉041881924
P粉041881924

全部回复(1)
P粉291886842

感谢@TylerH解决了这个问题。问题出在我的HTML中的transform样式上。删除它后,它可以正确滚动。从我看到的情况来看,它似乎会偏移滚动,并且好像是移动整个页面而不仅仅是元素。感谢大家的帮助,但我已经解决了。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号