Question

我正在尝试设计一个网页，其中包含三个带有一些文本的圆形按钮。但是，问题是我无法将文本排列在按钮的中心。文本水平居中。但是，它不是垂直居中。这是输出的屏幕截图： Screenshot

以下是使用的CSS：

button{
width: 10%;
height: 0;
margin-left: auto;
margin-right: auto;
padding-bottom: 10%;
border-radius: 50%;
border: 2px solid #f5f5f5;
box-shadow: 0 0 3px gray;
vertical-align: middle;
text-align: center;
}
button:hover{
    background-color: #E9D66B;
}

Answer 1

您可以通过普通的HTML CSS代码来实现：

button {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  border: 2px solid #f5f5f5;
  box-shadow: 0 0 3px gray;
}

<button>Hello</button>
<button>Testing</button>
<button>Check</button>

无法将文字放在圆形按钮的中心

1 个答案: