Flexslider 在滑块下方添加巨大的空白答案

【问题标题】：Flexslider Adding Huge White Space Below SliderFlexslider 在滑块下方添加巨大的空白
【发布时间】：2016-03-01 21:10:31
【问题描述】：

我的 flexslider 下方有大量空白，我不知道如何删除。我已经玩了很多 CSS，但似乎没有任何效果，没有破坏“响应”行为。非常感谢任何帮助。

问候...

站点可以在这里查看，所有代码都位于head标签中： http://destinjustlisted.com/new/

【问题讨论】：

标签： flexslider removing-whitespace

【解决方案1】：

包含幻灯片项目的 div 必须具有“flexslider”类。在 flexslider.css 中为该类设置了各种东西，这是下载的一部分。它具有的 CSS 属性之一是“边距”。您将在那里看到三个值。它看起来像这样：

margin: 0 0 60px;

我不知道你是否熟悉这种属性格式，但是当你有 4 种设置时，它在 CSS 中很常见，例如边距、边框或填充（所有这些都有 4 个边）。您最多可以有四个值，它们分别代表：上、右、下、左（就像您要绕着时钟表盘转，从 12 点开始）。所以，例如：

padding: 0 1px 0 2px;

不会在顶部和底部提供填充，但在右侧 1 个像素和左侧 2 个像素。

flexslider CSS 在底部有 60 像素的边距。如果您想要直观地表示您在幻灯片中的位置或选择特定幻灯片，则可以为导航按钮留出空间。不幸的是，如果您在设置插件时将属性“controlNav”设置为“false”，如果您不想显示那些“按钮”，那么您最终只会在控件下看到大的空白区域。如果您只是将该属性设置为此：

margin: 0;

你所有的问题都会迎刃而解！

【讨论】：

【解决方案2】：

如果您的图片尺寸不同（尤其是高度），Flexslider 容器将显示为与最高图片一样高。这可能会造成您可能看到的差距。

如果是这个原因，请提前调整图片大小，使它们都具有相同的高度和宽度。

【讨论】：