Question

我的网站上的CSS滑动门出现了一些小问题。它们在较低分辨率下显得很好，但较高的分辨率似乎会使按钮变大，从而导致按钮：悬停状态不能正常工作。

您可以在此处标题栏的右侧看到问题（登录/注册按钮）： http://www.bituser.com/forum/home.php

我尝试了多种解决方案，比如使用不同大小的字体和更改字体的测量方式，但我觉得我的方式是错误的。

这是一个JSfiddle： http://jsfiddle.net/bituser/vkMEg/1/（它看起来并不完全正确，但您应该会看到网站上使用的大部分代码。）

Answer 1

你刚刚没有加载其中一张图片。

你有：

#user_buttons_right_header span {
    background: url("./styles/prosilver/theme/images/button_left.png") no-repeat scroll left top transparent;
    padding: 1px 10px 4px;
}

你应该

#user_buttons_right_header span {
    background: url("http://www.bituser.com/forum/styles/prosilver/theme/images/button_left.png") no-repeat scroll left top transparent;
    padding: 1px 10px 4px;
}

您忘了让所有背景图片都有绝对路径。

除了字体外，一切似乎都没问题。

修改

恕我直言，问题可能在于应该以像素为单位设置的行高。

CSS滑门麻烦

1 个答案: