时间戳

首页 > 解决方案 > 滚动条不再出现

css - 滚动条不再出现

问题描述

我的应用程序中的滚动条突然消失了，我不明白为什么。我已经在我的 Angular 应用程序的 style.css 文件中配置了滚动条。大约一个小时前它就在那里，我没有更改任何其他 css 文件中的任何内容。有谁知道如何让它重新出现？！

在此处输入图像描述

右侧应该有一个滚动条

这是styles.css 文件：

::-webkit-scrollbar {
    width: 10px;
  }

  /* Track */
  ::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 10px;
  }

  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: black;
    border-radius: 10px;
  }

这是画廊列表 css 文件。这是在标题下方的图像中显示的组件：

ul {
    margin:0 10px 0 0;
    padding:0;   
}

li { list-style: none; }

.item-list-container {
    column-count: 4;
    column-gap: 1.1em;
    margin-top: 107px;   
}

图库列表 html 文件：

<ul class="container">
    <li class="item-list-container oneSec">
        <app-image-item
          *ngFor="let imageEl of galleryList"
          [image]="imageEl"
          (click)="onImageSelect(imageEl.id)"
          (click)="onLike(imageEl.imagePath)">
        </app-image-item>
    </li>
</ul>

标签： cssangular

解决方案

尝试降低 li 标签的高度

<ul class="container">
        <li class="item-list-container oneSec" style="height: 200px">
            <app-image-item
              *ngFor="let imageEl of galleryList"
              [image]="imageEl"
              (click)="onImageSelect(imageEl.id)"
              (click)="onLike(imageEl.imagePath)">
            </app-image-item>
        </li>
    </ul>

因为有时滚动条仅在容器高度较小且项目较多时才会出现

推荐阅读