Навигационные кнопки Flexslider не видны при наведении, с оранжевым полем

Question

Я использую FlexSlider 2 на сайте WordPress.

Кнопки навигации назад и вперед не работают - кнопка назад nav - это только оранжевая коробка, а кнопка навигации вперед выглядит странно.

Проверьте это здесь: http://www.friendshipart.net/artists-acf/

CSS здесь: http://www.friendshipart.net/wp-content/themes/colored-friendshipart/flexslider.css

Вот скрипт (в header.php):

<script type="text/javascript" charset="utf-8"> 
    $(window).load(function() { 
    $('.flexslider').flexslider({ 
     // Primary Controls 
      directionNav: true, 
      animation: "slide", 
      controlsContainer: ".flex-nav-container", 
    }); 
    }); 
</script> 

Как я могу сделать кнопки нав появляются обычно ?

Answer 1

Измените класс .flex-direction-nav li a в таблице стилей style.css (которую вы связали дважды). Удалите высоту, ширину и текст-отступ из этого класса и добавьте padding:15px;. Затем в таблице стилей flexslider.css измените класс .flex-direction-nav a::before на display:block; вместо display:inline-block;, а также в той же таблице стилей, установите .flex-direction-nav a ширину и высоту до 40 пикселей. Но убедитесь, что вы сохраняете только одну ссылку на стиль style.css, потому что стили будут переписываться друг с другом, что затрудняет поиск проблем в вашем css.

Дайте мне знать, если это поможет.