Всегда показывать высоту полосы прокрутки в области просмотра родительского div - PullRequest
Новая
       49

Всегда показывать высоту полосы прокрутки в области просмотра родительского div

1 голос
/ 01 мая 2019

Я использую React-Table в качестве компонента таблицы.Там я в основном представляю следующий сценарий: https://codesandbox.io/s/52lvxrj8r4

Вертикальная полоса прокрутки тела делает свое дело, однако она находится за пределами области просмотра родительского элемента div, который выполняет горизонтальную прокрутку.,Это означает, что вы видите вертикальную полосу прокрутки только тогда, когда полностью прокрутите горизонтальную полосу прокрутки вправо.

Мой HTML-код: 

<div class="rt-table">
   <div class="rt-tbody">
      test
      <br />
      test
      <br />
      (repeat test<br /> many times)
   </div>
</div>

Мой SASS: 

.rt-table {
  width: 600px;
  height: 600px;
  overflow-y: hidden;
  .rt-tbody {
    height: 1000px;
    width: 1000px;
    overflow-x: auto;
    overflow-y: scroll;
  }
}

Есть ли возможность убедиться, что вертикальная полоса прокрутки всегда отображается в области просмотра его родительского элемента, независимо от положения горизонтальной полосы прокрутки?

1 Ответ

0 голосов
/ 01 мая 2019

Измените sass, чтобы прокрутить родительский элемент, а не ребенка.

При создании прокручиваемого контейнера всегда следите за тем, чтобы меньший внешний контейнер содержал полосы прокрутки, в противном случае полосы прокрутки могут быть скрыты. 

.rt-table {
  width: 600px;
  height: 600px;
  overflow-y: scroll;
  .rt-tbody {
    height: auto;
    width: 1000px;   
  }
}
...