html – 当Firefox中的按钮处于活动状态时,如何防止按钮文本移动

发布时间：2020-12-14 16:39:58 所属栏目：资源来源：网络整理

导读：样品： buttonButton/buttonbutton { border: medium none; margin-top: 17px; width: 224px; height: 40px; background: none repeat scroll 0% 0% #7BA6BB; color: #FFF; outline: medium none; cursor: pointer;} http://codepen.io/anon/pen/ByaLZN 浏览

样品：

<button>Button</button>


button {
    border: medium none;
    margin-top: 17px;
    width: 224px;
    height: 40px;
    background: none repeat scroll 0% 0% #7BA6BB;
    color: #FFF;
    outline: medium none;
    cursor: pointer;
}

http://codepen.io/anon/pen/ByaLZN

浏览器：Mozilla Firefox(最新版本)

单击按钮(激活)时,按钮文本向右移动.怎么预防呢？

解决方法

http://jsfiddle.net/reg8f6eo/作为解决方案之一：添加填充：0表示按钮：活动

或者你可以在你的按钮中添加span(或者你喜欢的其他标签),例如http://jsfiddle.net/reg8f6eo/1/

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!