правило CSS не применяется в сафари, но хорошо в светлячок

Question

Я пытаюсь выяснить, почему это правило не применяется в Safari или IE

.navbar-inner { 
    min-height: 40px; 
    padding-right: 20px; 
    padding-left: 20px; 
    background-color: #333333 !important; 
    background-image: linear-gradient(to bottom, rgb(74, 74, 74), rgb(54, 54, 54)) !important; 
    background-repeat: repeat-x; 
    border: 1px solid rgb(212, 212, 212); 
    border-radius: 4px 4px 4px 4px; 
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.067); 
} 

В принципе, я пытаюсь переписать фон цвет навигатора в бутстрапе. , как вы можете видеть, я добавил ключевое слово! Important, просто чтобы проверить проблемы специфики css. Это еще не решило проблему. Можете ли вы дать мне какие-либо предложения по устранению неполадок? Он отлично работает в Firefox .... , и я просто тестирую в Chrome.

Спасибо.

Answer 1

Различные браузеры используют разные свойства градиента. This - действительно хороший инструмент для их создания.

Для этого вы можете использовать:

.navbar-inner { 
    background: rgb(74,74,74); /* Old browsers */ 
    background: -moz-linear-gradient(top, rgb(74,74,74) 1%, rgb(54,54,54) 100%); /* FF3.6+ */ 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgb(74,74,74)), color-stop(100%,rgb(54,54,54))); /* Chrome,Safari4+ */ 
    background: -webkit-linear-gradient(top, rgb(74,74,74) 1%,rgb(54,54,54) 100%); /* Chrome10+,Safari5.1+ */ 
    background: -o-linear-gradient(top, rgb(74,74,74) 1%,rgb(54,54,54) 100%); /* Opera 11.10+ */ 
    background: -ms-linear-gradient(top, rgb(74,74,74) 1%,rgb(54,54,54) 100%); /* IE10+ */ 
    background: linear-gradient(to bottom, rgb(74,74,74) 1%,rgb(54,54,54) 100%); /* W3C */ 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4a4a4a', endColorstr='#363636',GradientType=0); /* IE6-9 */ 
} 

!important не должно быть необходимым при попытке переопределить Bootstrap по умолчанию стиль. Просто убедитесь, что ваш стиль Bootstrap добавлен на страницу до ваш пользовательский стиль.