没有文字呈现的HTML按钮与文字不同

Question

例行中的5个按钮的HTML按钮元素呈现不同，带有文本的按钮呈现在相同的顶部位置，但是没有文本的按钮呈现上半部分。让我告诉你
https://jsfiddle.net/zznjrv9L/ html

<button>234</button>
<button></button>
<button>234</button>
<button>234</button>
<button></button>

的CSS

 button{
  height:25px;
  width:25px;
  }

我在Chrome浏览器中尝试过。我该如何解决所有按钮都呈现在同一顶部位置的问题？

Answer 1

使用inline-block作为按钮，并使用top / middle / bottom来保持一致性：

button{
  height:25px;
  width:25px;
  display: inline-block;
  vertical-align: top;
}

演示