Почему переопределение не работает?

Question

У меня есть footer, и я установил, что все поля и отступы равны нулю в начале. Когда я хочу установить нижний колонтитул в text-align: center, ничего не изменилось для my .footer p. Однако заполнение по-прежнему равно 0 по горизонтали, а не по 9 пикселей по вертикали.

.footer{ 
     background-image: url("../img/naviga.png"); 
     width: 1000px; 
     height: 30px; 
/* my div settings */ 
     background-repeat: repeat-y; 
     font-weight: bold; 
     text-align: center; 
/* my div settings */ 
     font-family: verdana, arial, sans-serif; 
     font-size: 10px; 
     } 

/* p tag is my footer text */ 
.footer p{ 
     padding: 9px auto 9px auto; 
     } 

[have a look plz][1] 
[1]: http://i.stack.imgur.com/D77IT.png */ 

Почему это переопределение не работает? Я также пробовал с !important.

Answer 1

Вы не можете сделать padding: 9px auto, так как auto является недействительным имуществом для padding. Вот почему собственность выложена на картинке, которую вы предоставили.

Проверьте документы MDN для padding, here.

Все свойства обивка может иметь следующие значения:

length - специфицирует обивка в рх, PT, см и т.д.

% - задает отступ в% от ширины содержащий элемент

inherit - указывает, что обивка должна быть унаследован от родительского элемента

---

Вот один из нескольких способов вертикального и горизонтального выравнивания текста в середине. Проверьте это fiddle или снимок ниже.

.footer { 
 
    display: table; 
 
    background: red; 
 
    width: 1000px; 
 
    height: 30px; 
 
    background-repeat: repeat-y; 
 
    font-weight: bold; 
 
    text-align: center; 
 
    font-family: verdana, arial, sans-serif; 
 
    font-size: 10px; 
 
    } 
 
    .footer p { 
 
    display: table-cell; 
 
    vertical-align: middle; 
 
    }

<div class="footer"> 
 
    <p> 
 
    text 
 
    </p> 
 
</div>

Answer 2

вы не можете использовать авто в набивке. Попробуйте для CSS:

.footer p { padding: 9px 0px; }

и не пропустите ваш рост сноска установлен на 30 пикселей. Вы можете изменить его размер или p вылезет .footer

Проверить ссылку: https://jsfiddle.net/L5p38nc3/1/