Почему на панели навигации не отображается цвет при использовании "padding: 10px;! Imprtant;"

Question

Пожалуйста, помогите, я новичок в этом, и это меня смущает. Когда я удаляю эту строку, цвет возвращается, но когда я использую его, он просто исчезает. Я пытаюсь следовать некоторому руководству о том, как сделать сайт из YouTube, но эта линия просто не работает со мной!

Почему на моей навигационной панели не появляется цвет при использовании padding: 10px ; !important;

    * {
        margin: 0;
        padding: 0;
    
    }
    
    body {
        font-family: sans-serif;
    
    }
    
    #nav-bar {
    
        position: sticky;
        top 0;
        z-index: 10;
    }
    
    .navbar {
        background-image: linear-gradient(to right, #800000, #B22222)
            padding: 10px ; !important; 
    }

<!-- 7:34 min https://www.youtube.com/watch?v=v0IgI8vYD_o&list=PLjwm_8O3suyMKWZwlgptQtfCShqZ2syV5 -->

Спасибо заранее!

Answer 1

У вас есть ошибки, попробуйте исправить это:

#nav-bar {

    position: sticky;
    top: 0;  // Add : here.
    z-index: 10;
}


.navbar {

        background-image: linear-gradient(to right, #800000, #B22222);// Add ; here.
        padding: 10px ; 
}

Answer 2

Это потому, что вы пропустили точку с запятой после фона.

background-image: linear-gradient(to right, #800000, #B22222);

- это то, что должно быть.

В следующей строке у вас есть один слишком много точек с запятой, и вы неправильно написали важные ... Кстати, вы вообще должны стараться избегать использования !important. Похоже, в любом случае это вам не нужно:).