Почему свойство text-align не работает внутри элемента кнопки? - PullRequest
0 голосов
/ 28 июня 2018
button {
    text-align: center;
    font-size:50px;
    color:black;
    border:2px solid white;
    border-style:dotted;
    border-color:red;
}

Когда я запускаю этот код, все свойства работают, кроме выравнивания текста. Я не понимаю, почему выравнивание текста не работает, когда оно внутри кнопки?

Примечание: Да, я знаю, что есть способы выровнять кнопку по центру, я не спрашиваю, как выровнять кнопку, я спрашиваю, почему выравнивание текста не работает внутри элемента кнопки, как и все другие свойства работают?

Ответы [ 3 ]

0 голосов
/ 28 июня 2018

Так не работает. Назначение свойства text-align:center самой кнопке не выровняет ее по центру. Вы должны назначить это свойство его родителю. или вы можете назначить ширину кнопке и добавить margin: 0 auto; в качестве альтернативного способа.

Вот решение вашей проблемы. Добавить этот CSS

.btnwrap {
  text-align: center;
}

И, оберните вашу кнопку с <p>

<p class="btnwrap">
  <button>button 2</button>
</p>
0 голосов
/ 28 июня 2018
0 голосов
/ 28 июня 2018

попробуйте добавить поле авто

text-align: center;
margin: auto;

или задайте !important для text-align, может быть, есть другой код CSS, воздействующий на вашу кнопку

...