HTML – 奇怪的CSS3按钮

概述在某些用例中,我的 CSS3按钮无法正确显示.在FF&它们显示的Safari很好,但在Chrome中,左手边框较粗,当您将鼠标悬停在它们上方时,填充颜色不会填充100％的区域.查看工作示例： http://jsfiddle.net/3x4zc8tq/3/如何解决？ /* @group Center all the things */.center-wrapper { position: 在某些用例中,我的 CSS3按钮无法正确显示.在FF&它们显示的Safari很好,但在Chrome中,左手边框较粗,当您将鼠标悬停在它们上方时,填充颜色不会填充100％的区域.查看工作示例： http://jsfiddle.net/3x4zc8tq/3/如何解决？

/* @group Center all the things */.center-wrapper {    position: absolute;    wIDth: 100%;    height: 100%;    top: 0;    left: 0;}    .center-wrapper .center {        position: relative;        overflow: hIDden;        top: 50%;        -webkit-transform: translateY(-50%);            -ms-transform: translateY(-50%);                transform: translateY(-50%);       /* This fixes the blurred buttons but breaks centering       -webkit-backface-visibility: hIDden;               backface-visibility: hIDden;       transform: translateZ(0);*/     }/* @end */

如下所示的经过测试和测试的方法对我不起作用：

-webkit-backface-visibility: hIDden;        backface-visibility: hIDden;transform: translateZ(0);

解决方法 您可以尝试将此添加到.btn ::之前的CSS规则中

.btn::before {    left:-1px;    wIDth:101%;}

http://jsfiddle.net/3x4zc8tq/6/

总结

以上是内存溢出为你收集整理的HTML – 奇怪的CSS3按钮全部内容，希望文章能够帮你解决HTML – 奇怪的CSS3按钮所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。