html - 即使给定相同的属性和值，按钮大小也不同

Question

在我的页面底部有 3 个按钮。 “发送、保存和取消”按钮。 “保存”和“取消”按钮的高度相同，但“发送”按钮与其他两个按钮不同。为什么会这样？

我在另一篇文章中读到说元素呈现的按钮与普通按钮不同，所以我尝试使用给定的解决方案修复它，但没有成功。我也尝试删除元素，但它仍然没有用。感谢您的帮助!

按钮样式

  background-color: #8f81e8;
  color: #fff;
  border-radius: 5px;
  text-transform: uppercase;
  font-weight: 300;
  font-size: 16px;
  cursor: pointer;
  padding: 1rem; 

CodePen

Answer 1

因为你的send是input，而其他元素是button。

添加 border: none; 到你的 css