Question

我正在尝试在当前的跨浏览器项目中设置按钮样式。

当我在Safari中检查这些按钮时，它们看起来与任何其他浏览器不同。通常，FF和Chrome中的按钮看起来相同。但是在Safari按钮中，顶部，底部，左侧和右侧都有明显的额外空间，因此按钮在Safari中看起来更宽，而不是在Chrome或其他浏览器中。我可以在Safari中删除提交按钮上的额外空格吗？

我目前的css是：

.location-form-wrapper input[type="submit"] { 
    border-radius: 0 5px 5px 0; 
    float: left; 
    padding: 20px 23.8px; 
 } 
 input[type="submit"], input[type="button"], button, input[type="reset"] { 
    background: #facc26 none repeat scroll 0 0; 
    border: 1px solid transparent; 
    border-radius: 5px; 
    box-shadow: none; 
    color: #ffffff; 
    cursor: pointer; 
    display: inline-block; 
    font-family: "latobold"; 
    font-size: 18px; 
    line-height: 1; 
    padding: 12px 26px; 
    text-transform: uppercase; 
    transition: all 300ms linear 0s; 
  }

Answer 1

我刚刚遇到过这个问题，Safari 9.0.2。这可能太微不足道了，但我刚刚添加了＃34;保证金：0＆＃34;按钮的CSS和 - 好吧，边缘 - 消失了，让按钮填满我想要的整个区域。

Safari在提交按钮周围占用空间

1 个答案: