Question

我使用提交按钮为我的表单在所有浏览器中工作正常，除了ie7 当用户点击它时它会移动请建议我做什么

.confirm-button-submit 
{
   width       : 79px;
   font        : bold 12px sans-serif;;
   color       : #000;
   background      : url("../images/confirm-btn.png") 0 -33px no-repeat;
   text-decoration : none;
   margin-top      :0px;
   text-align:center;
   border:0px;
   cursor : pointer;
   height:32px;
   padding     : 8px 0px 12px 0px;
}

.confirm-button-submit:hover 
{
   width       : 79px;
   font        : bold 12px sans-serif;;
   color       : #fff;
   background      : url("../images/confirm-btn.png") 0 0 no-repeat;
   text-decoration : none;
   margin-top      :0px;
   text-align:center;
   border:0px;
   cursor : pointer;
   height:32px;
   padding     : 8px 0px 12px 0px;
}

我用过这个css请告诉我该怎么做

代码：

<input type="button" value="Show" name="commit" onclick="range_validation(this)" class="confirm-button-submit"/>`

Answer 1

悬停类会自动继承未指定的任何值，因此您可以删除任何重复属性。

你的意思是什么？如果您的意思是当您悬停时，按钮会移动，然后删除冗余属性将帮助您缩小导致此属性的属性。

如果点击了，那么你需要向我们展示javascript函数“Range_validation”，看它是否有任何定位。

Answer 2

首先，你的CSS可以大大减少：

改进CSS：

.confirm-button-submit, .confirm-button-submit:hover
{
   width           : 79px;
   font            : bold 12px sans-serif;;
   color           : #000;
   background      : url("../images/confirm-btn.png") 0 -33px no-repeat;
   text-decoration : none;
   margin-top      : 0;
   text-align      : center;
   border          : 0;
   cursor          : pointer;
   height          : 32px;
   padding         : 8px 0px 12px 0px;
}

.confirm-button-submit:hover
{
   color       : #fff;
   background  : url("../images/confirm-btn.png") 0 0 no-repeat;
}

使用你的CSS，一切似乎都可以，问题可能是另一种可能影响你的按钮或页面的其他元素的全局风格......你有一个链接来查看“在行动中”的问题吗？ / p>

Answer 3

提交悬停的图像与其他提交类的值不同，不确定它们的用途（从未在那里使用过额外值），但它们看起来像定位或边缘值。这些可能会导致图像在他盘旋时改变位置......也许？

点击提交按钮移动它的位置

3 个答案: