溢出自动无法正常工作

Question

我正在尝试使用顶部和侧面导航栏创建用户仪表板。我遇到的问题是overflow: auto无法正常工作。我得到滚动条但它不会滚动到页面的末尾。

我的小提琴链接 - Link

在移动设备中没有问题但是我在全宽设备（笔记本电脑）中遇到了这个问题。

除此之外，我们如何将字体真棒图标和侧边栏中的链接集中在一起？

谢谢

Answer 1

您可以在这里工作jsfiddle您可以在底部添加一些padding，这样您的内容就会在窗口中显示。

此外，我已经更新了jsfiddle并添加了更多样式，因此图标现在居中。

Answer 2

欢迎来到SO

将<div class="col-sm-10 col-md-11 affix-content" style="overflow-y:scroll;">更改为<div class="col-sm-10 col-md-11 affix-content">，并且不需要overflow-y，并将正文overflow更改为overflow-x:hidden而不是overflow:hidden和height:auto代替height:100%

并且有效

请参阅jsFiddle Updated

Answer 3

我不知道这是否是解决问题的正确方法，但是当我在CSS中更改此内容时它会正常工作：

 .affix-row,
 .affix-container,
 .affix-content {
    height: 100%;
    margin-left: 0;
    margin-right: 0;
 }

到此

 .affix-row,
 .affix-container,
 .affix-content {
    height: 90%;
    margin-left: 0;
    margin-right: 0;
 }

希望它至少有助于将其缩小到：

height: 100%;

要修复图标中心问题，您可以删除每个图标顶部的像素，如下所示：

.fa-cloud-download:before {
  margin-top:-10px;
 }