CSS - IE8 ошибки

Question

У меня есть сайт, который WordPress сталкивается проблемы совместимости в Internet Explorer 8. http://www.sunsetbaycharters.net

Навигационное меню не загружается должным образом в IE8 & IE7.

Bad Nav в IE8

Кроме того, блок контента в моем сайте не являются прозрачными в IE8. Я понимаю, это потому, что я использую RGBA, и мне нужно знать, как это исправить.

Пожалуйста, расскажите, как я могу исправить навигационное меню в IE8 & IE7 и прозрачный ящик rgba.

CSS код для Nav Menu:

div#top-menu, div#top-menu.et-fixed { 
    background-color: white; 
    position: fixed; 
    top: 0px; 
    left: 0px; 
    width: 100%; 
    z-index: 1000; 
    box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.8); 
    height: 80px; 
    text-align: center; 
} 

Answer 1

Для коробки прозрачности фона содержимого вы должны использовать фоновое изображение (как IE8 не поддерживает прозрачность). Просто сделайте 5x5 квадратный PNG цвета/прозрачности, который вы хотели бы использовать, и установите его как фоновый повтор. Например:

.target-element { 
    background-image: url('images/your-transparent-tile.png'); 
    background-repeat: repeat; 
} 

Что касается вопроса о расстоянии между коробками, вам нужно будет взглянуть на ваш CSS. Вероятно, это будет связано с отсутствием поддержки IE8 display: inline-block.