CSS меню мерцает со всеми браузерами

Question

Я получаю мерцание в первых 3 из 9 основных элементов навигации в моих CSS-меню (нет подменю), которое происходит в IE, Safari, Firefox и Chrome, но ТОЛЬКО на домашняя страница.

В частности, первый пункт меню «О программе» мерцает больше всего, в то время как «Приемники» и «Академики» мерцают, но не так открыто.

Мои мысли о том, что что-то противоречит меню на домашней странице, особенно что-то уникальное для домашней страницы, например, поиск Google, который я встроил в верхнюю навигацию (и старался как можно более ненавязчиво стилизовать) , или слайд-шоу jQuery.

Я попытался предложить несколько решений для мерцания в webkit, но никто не решил проблему.

Answer 1

Похоже, что это связано с тем, что ваши вышивальные шторы слишком широки. Таким образом, наведение на элемент навигации показывает их, что сразу же приводит к тому, что мышь расположена над ними, а не элемент навигации ... заставляя их снова скрываться. Отсюда мерцание (я думаю!).

Это не происходит в навигационных элементах справа, потому что они достаточно короткие, поэтому они не закрывают навигационные ссылки, когда «скрыты».

См. Изображение ниже ширины.

Изменение CSS, чтобы иметь больше верхнего значения -800px вроде следующего может помочь:

.dropdownContain { 
    width: 160px; 
    position: absolute; 
    z-index: 2; 
    left: 50%; 
    margin-left: -80px; /* half of width */ 
    top: -800px; 
}