html - 图像在悬停时稍微向右移动？

Question

我的某些按钮的悬停状态和事件状态都存在问题。

当您将鼠标悬停或激活时，您在上方看到的按钮会稍微向右移动。但是我的箭头按钮工作正常。

这是中间按钮的 CSS 代码:

div.clean_rounded-horizontal.st_sliding_active >div.st_tabs{overflow:visible}

div.clean_rounded-horizontal >div.st_tabs div.st_tabs_wrap{position:relative !important;width:100%}

div.clean_rounded-horizontal.st_sliding_active >div.st_tabs div.st_tabs_wrap{width:auto !important;margin:0px 49px}

div.clean_rounded-horizontal >div.st_tabs ul{width:10000px;margin:0px;padding:0px;list-style:none}

div.clean_rounded-horizontal >div.st_tabs ul li{display:block;float:left;margin:0px}

div.clean_rounded-horizontal >div.st_tabs ul li a{color:#98d1e9;display:block;height:50px;text-decoration: none;text-align:center;width:90px;font:bold 12px/50px Arial,Helvetica,sans-serif;background:url("http://i52.photobucket.com/albums/g25/AniM3Fr3aK/portbuttons_zps914fad15.png~original") no-repeat}

div.clean_rounded-horizontal >div.st_tabs ul li a:hover{background-position:center -51px;}

div.clean_rounded-horizontal >div.st_tabs ul li a.st_tab_first{}div.clean_rounded-horizontal.st_sliding_active >div.st_tabs ul li a.st_tab_first{border-left:0 none;border-top-left-radius:0px}

div.clean_rounded-horizontal >div.st_tabs ul li a.st_tab_last{}

div.clean_rounded-horizontal.st_sliding_active >div.st_tabs ul li a.st_tab_last{border-right:0 none;border-top-right-radius:0px}

div.clean_rounded-horizontal >div.st_tabs ul li a.st_tab_active{background-position:center -51px;}

感谢您的帮助，不知道为什么会这样。

Answer 1

我找到了解决方案。出于某种原因，当我将它居中时，它会向右移动一点。所以要修复它，我必须将中心更改为左侧。像这样

div.clean_rounded-horizontal >div.st_tabs ul li a.st_tab_active{background-position:left -51px;}