主页 / 问题 / 1124280
Accepted
Stas
Asked:2020-05-12 18:17:12 +0000 UTC2020-05-12 18:17:12 +0000 UTC

更改可滚动块的显示顺序

  • 772

我想知道如何使这个块在 Firefox 浏览器中可滚动。我试图添加一个父块min-height: 0;，没有帮助。提前致谢！

.parent{
  width: 200px;
  height: 200px;
  display: flex;
  flex-direction: column-reverse;
  overflow: scroll;
}
.parent div{
  width: 80%;
  background: #aaa;
  margin-top: 5px;
}
<div class="parent">
  <div> 1 </div>
  <div> 2 </div>
  <div> 3 </div>
  <div> 4 </div>
  <div> 5 </div>
  <div> 6 </div>
  <div> 7 </div>
  <div> 8 </div>
  <div> 9 </div>
  <div> 10 </div>
  <div> 11 </div>
  <div> 12 </div>
  <div> 13 </div>
  <div> 14 </div>
</div>

javascript

1 个回答

  1. Best Answer

    document.querySelector('.parent').scrollTo(0, 999999999);
    .parent {
  width: 200px;
  height: 200px;
  overflow-y: scroll;
}

.viewport {
  display: flex;
  flex-direction: column-reverse;
}

.viewport div {
  width: 80%;
  background: #aaa;
}

.viewport div:not(:last-child) {
  margin-top: 5px;
}
    <div class="parent">
  <div class="viewport">
    <div> 1 </div>
    <div> 2 </div>
    <div> 3 </div>
    <div> 4 </div>
    <div> 5 </div>
    <div> 6 </div>
    <div> 7 </div>
    <div> 8 </div>
    <div> 9 </div>
    <div> 10 </div>
    <div> 11 </div>
    <div> 12 </div>
    <div> 13 </div>
    <div> 14 </div>
  </div>
</div>

    • 0

相关问题