方形空间上的水平溢出滚动 - 消除空白区域？

Question

这是我的网站：

www.lukassuarez.com

我在我的图库中使用下面的代码来创建水平滚动。唯一的问题是最后有很多空白区域。

简单的问题 - 如何删除空格？

<style>
   .sqs-gallery {
     overflow: scroll;
   }
   body {
     background-image: none;
   }
   .sqs-gallery-design-strip-slide {
     padding-left: 3px;
     padding-right: 3px;
   }
 </style>
 
 <script type="text/javascript">
   $( window ).load(function() {
     w = $(".sqs-wrapper").width();
     $(".sqs-wrapper").width(w/2);
   })
 </script>

Answer 1

如果您只能编辑CSS，则可以隐藏未使用的元素，并将较低的填充和边距设置为其他元素。

您可以使用浏览器的开发人员工具轻松查看占用空白区域的元素，并检查不需要的白色区域。

在您的情况下，您可以看到没有内容的页脚，只有min-height: 34px;的空HTML标记。您还可以看到div元素与ID＆＃39; page＆＃39; padding: 50px 0;和div ID为＆＃39; canvas＆＃39;与padding: 20px;

示例CSS：

#footerBlock {
    // Remove min-height
    min-height: 0;
}

#page {
    // Lower bottom padding
    padding: 50px 0 20px;
}

如果您有权访问HTML文件，其他可能性是用内容填充页脚或完全删除页脚。