Html 什么样的CSS值使按钮标记显示得比div标记低？

我用过一些按钮，但想把它改成，因为这样更方便

我做了那个简单的改变。令我惊讶的是，屏幕上显示了一些像素，可能比放置的位置低10像素

我试图查看所有CSS值，但看不到任何更改。我想我错过了什么

有人知道我会错过什么CSS值吗？这是谷歌Chrome，目前还没有在FF中测试过

更新：在FF中看起来是一样的。也就是说，将其放置在较低的位置。 所有计算的CSS值在FF中都是相等的

因此，除了CSS之外，似乎还有其他一些规则在放置较低的位置。是否有一些HTML规则可以做到这一点，或者

更新2：当然，所有东西都是边框框

更新3：以下是来自FF的所有计算样式变量：

animation-delay: 0s;
animation-direction: normal;
animation-duration: 0.65s;
animation-fill-mode: none;
animation-iteration-count: 1;
animation-name: click-wave;
animation-play-state: running;
animation-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
background-attachment: scroll;
background-clip: border-box;
background-color: #CE742B;
background-image: none;
background-origin: padding-box;
background-position: 0% 0%;
background-repeat: repeat;
background-size: auto auto;
border-bottom-left-radius: 2px;
border-bottom-right-radius: 2px;
border-top-left-radius: 2px;
border-top-right-radius: 2px;
box-sizing: border-box;
color: #333;
cursor: pointer;
display: inline-block;
float: none;
font-family: RobotoDraft,"Helvetica Neue",Helvetica,Arial;
font-size: 14px;
font-weight: 400;
height: 32px;
line-height: 17px;
margin-bottom: 0px;
margin-left: 8px;
margin-right: 0px;
margin-top: 0px;
min-width: 80px;
overflow: hidden;
overflow-x: hidden;
overflow-y: hidden;
padding-bottom: 0px;
padding-left: 8px;
padding-right: 8px;
padding-top: 0px;
position: relative;
text-alignrightwidth: 80px;

---

我想我通过查看你的jsbin解决了这个问题。奇怪的是，当你有连续的div+按钮时，宽度：80px会导致按钮的位置异常。我不知道为什么

---

修复方法是添加float:left，它们正确对齐。或者使用div+div | |按钮+按钮。

好问题，当然，@alvarontoro。我已经在FF中添加了在UI中看到的所有内容。虽然我刚刚意识到我并没有全部加进去。上面的列表不包括浏览器样式。这些是按钮或div的计算样式吗？我们需要两者进行比较。这个问题看起来像是某种样式以不同于div的方式影响按钮，可能不是您设置的，而是默认浏览器的value@AlvaroMontoro：它们都是相同的，除了文本对齐，但这并不重要。我还检查了FF中的“浏览器样式”按钮并查看了所有值，但我还是找不到任何不同的地方。除了border，但我已经尝试设置border:none。垂直位置没有变化。我认为您可能缺少一些其他样式，因为使用提供的样式，我无法重现问题。你能提供一个答案吗？是的，很奇怪。你能添加一个链接到你的小提琴版本吗？当然：。就像我说的，我所做的就是添加float:left；移除浮动：无；。或者使用div+div | |按钮+按钮。