css - 无法使用 css 更改按钮高度

Question

无法增加按钮的高度。默认情况下，它以计算样式显示为 18px。改变宽度工作正常。我应用margin-left，top的所有其他样式也可以，但为什么不是Height？

   <input name="cancel" id="cancel" type="button" value="Cancel">

css

input#cancel {
   margin-top: 30px;
   margin-left: 48px;
   width: 70px;
   height: 24px!important;
}

我也试着像这样给出 id 的高度

   #cancel {
       height:24px;
   }

让我知道您是否需要在浏览器中显示的计算样式。请帮忙

Answer 1

您需要添加-webkit-appearance: none;到您的类以禁用 safari 的默认按钮样式

<input name="cancel" id="cancel" type="button" value="Cancel">
input#cancel { 
    margin-top: 30px; 
    margin-left: 48px; 
    width: 70px; 
    height: 42px; 
    -webkit-appearance: none;
}

看到这个小提琴

Answer 2

这对我有用（请参阅我作为对您帖子的评论发布的小提琴链接）。我的猜测是有一种风格与之冲突并覆盖它。高度设置对我来说无论显示类型如何都有效，因此必须有其他东西覆盖高度。