Под моим флекслайдером большое количество белого пространства, и я не знаю, как его удалить. Я немного поигрался с CSS, и, похоже, ничего не работает, не нарушая "отзывчивого" поведения. Любая помощь приветствуется.
С Уважением...
Сайт можно посмотреть здесь, весь код находится в теге заголовка: http://destinjustlisted.com/new/
Ваш div, содержащий элементы слайд-шоу, должен иметь класс «flexslider». Различные вещи настраиваются для этого класса в файле flexslider.css, который является частью загрузки. Одно из его свойств CSS - «маржа». Вы увидите три значения. Это выглядит так:
margin: 0 0 60px;
Я не знаю, знаком ли вам этот формат свойств, но он часто встречается в CSS, когда у вас есть 4 настройки, такие как поля, границы или отступы (все из которых имеют 4 стороны). У вас может быть до четырех значений, которые представляют: верхнее, правое, нижнее, левое (как если бы вы вращали циферблат часов, начиная с 12 часов). Так, например:
padding: 0 1px 0 2px;
не даст отступов сверху и снизу, но 1 пиксель справа и 2 пикселя слева.
CSS flexslider имеет поле в 60 пикселей внизу. Это оставляет место для кнопок навигации, если вы хотите визуальное представление того, где вы находитесь в слайд-шоу, или чтобы вы могли выбрать конкретный слайд. К сожалению, если вы установите для свойства «controlNav» значение «false» при настройке плагина, если вы не хотите, чтобы эти «кнопки» отображались, то вы просто получите большую пустую область под элементом управления. Если вы просто установите это свойство на это:
margin: 0;
все ваши проблемы будут решены!
Если ваши изображения имеют разные размеры (в частности, высоту), контейнер Flexslider будет отображаться на высоте самого высокого изображения. Это может создать пробел, который вы можете увидеть.
Если это причина, заранее измените размер изображений, чтобы все они имели одинаковую высоту и ширину.
