我正在做一个响应式设计的 wordpress 网站。现在我的标记是这样的
<div class="contact-wrap">
<div class="contact-number">123-456-7890</div><!--.contact-number-->
<div class="user-login"><a href="#"><span class="login-icon">Login</span></a></div><!--.user-login-->
</div>
而css是这样的
.contact-wrap {
padding: 0;
margin: 25px 0 0 0;
overflow: hidden;
}
.contact-wrap .contact-number {
background-image: url('images/contact-icon.png');
background-position: 0 7px;
background-repeat: no-repeat;
color: #d4001a;
font-size: 22px;
font-weight: bold;
padding: 0 0 0 24px;
float: left;
}
.contact-wrap .user-login {
padding: 4px 0 0 0;
float: right;
}
.user-login a {
background-image: url('images/login-bg-sprited.png');
background-position: 0 -27px;
background-repeat: no-repeat;
padding: ;
width: 62px;
height: 27px;
display:inline-block;
padding: 0 0 0 4px;
}
现在,由于该站点将处于响应状态,它正在寻找 960 像素和更大的屏幕,但是当我调整屏幕大小时,联系人号码的背景图像不是很好。这是更大屏幕的屏幕截图。
这是屏幕尺寸320X480.
所以有人可以告诉我这里出了什么问题。任何帮助和建议都将不胜感激。