在所有显示器尺寸上向右移动 div

Question

所以我试图让网站的标题在左边有公司标志，然后在右边有数字和座右铭。我这样做的方法是在 div 中制作数字和座右铭，使其位置绝对，并使用 left 属性将其推到正确的位置。这工作正常，除了在更大的显示器上。 div 似乎移动到屏幕边缘的左侧，而不是它所在的 div 边缘的左侧。这是代码，知道我缺少什么吗？

<!-- HTML -->
<div id="wrap">
<img id="pic1" alt="Company Logo" src="../Images/******OfficialLogo.jpg">
<div id="contain1">
    <span class="style1">Call (800) ###-####&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><br>
    <span class="style2"><em>Providing sales and management solutions to independent retailers since 1978</em></span>
</div>

<!-- CSS stylesheet -->
#wrap {
width: 1000px;
margin: 0 auto;
}
#contain1 {
display: block;
position: absolute;
text-align: right;
top: 15px;
left: 215px;
}

Answer 1

我是这样理解您的需求的：

• 徽标应位于页眉的左上角。 （对着屏幕左侧）
• 数字和座右铭应位于页眉的右侧。 （在屏幕右侧）

如果我是正确的，那么您想将您的 css 更改为

#wrap {
    width: 100%;
    margin: 0 auto;
}
#contain1 {
    display: block;
    text-align: right;
    float: right;
    top: 15px;
}

您可能希望标题跨越整个网站宽度。

此外，浮动 contains1 对象是一个好主意，无需绝对位置。

Result shown in the Fiddle.