css - label文字居中

Question

label文字居中

.Botton {
    background-color: white;
    margin-left: 0.63rem;
    border-radius: 0.36rem;
    font-size: 1.6rem;
    height:2rem;
    width:1.5rem;
    display: -webkit-inline-box;
    font-weight: 300;
    text-align:center;
}

<label class="Botton">1</label>

没有居中是什么原因，不想通过设置padding

Answer 1

Why the botton tag? Isn’t it a button

Answer 2

Centered left and right: text-align:center;
Centered top and bottom: line-height:2rem;

Answer 3

For interline elements, you need to write inline-block

In fact, it is recommended that you pad left and right

Answer 4

text-align:center;display:inline-block;

Answer 5

The inline block you use will adapt to the content, and there is no way to control the position of the content inside the block

Answer 6

What is label? Please pay attention to label semantics