html文本居中

Question

我正在尝试将文本置于按钮的中心，并且碰壁。现在，我的代码如下：

.plus {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 1px 1px;
    text-align: center;
    line-height: 15px;
    text-decoration: none;
    display: inline-block;
    font-size: 5px;
    cursor: pointer;
    width: 15px;
    height: 15px;
  }
  .plus1 {border-radius: 50%;}

我尝试更改字体大小，但是什么也没做。我一直在编辑填充设置，下面的图像是我可以获得的最接近的图像，如图所示：

但是，它仍然没有居中！如何上移文字？ 谢谢。

Answer 1

您的代码（除了较大的字体）在独立页面中看起来不错：

.plus {
  background-color: #4CAF50;
  border: none;
  color: white;
  padding: 1px 1px;
  text-align: center;
  line-height: 15px;
  text-decoration: none;
  display: inline-block;
  font-size: 15px;
  cursor: pointer;
  width: 15px;
  height: 15px;
}

.plus1 {
  border-radius: 50%;
}

<a class="plus plus1">+</a>

这意味着，如果您得到的图像看起来与图像类似，那么页面上还会有其他CSS干扰。

Answer 2

我修复了！我将行高更改为5px，现在看起来像：fixed button