0

在我的工作中，我们根据现有的 HTML 模板为客户定制页面，这意味着我们唯一可以修改的就是 CSS。所以很明显，这意味着很多时候都要为问题寻找创造性的解决方案。不确定这是否可以做到，但我需要仅使用 CSS 将页面上的元素重新定位到其原始位置的左侧。基本上，这个元素通常是居中的，但是他们需要图像位于屏幕的右上角（我已将其设为背景图像），而不是居中其标题图像，因此其他元素的“居中”现在是向右一点。

我的问题是我只能找到这样做的方法，导致元素在较小的窗口中被切断屏幕的左侧。有没有办法，仅使用 CSS，将元素定位到其原始位置的左侧，而不会让它掉出浏览器窗口？对不起，如果其中任何一个解释得不好，我每天都这样做，但我完全是自学的。这是我尝试过的（不成功）：

.content {
background: #ffffff;
color: #000000;
margin-top: 0px;
position: relative;
left: -20%;
}

我也尝试过使用 margin-left ，以及将 min-width 添加为 100%。当我尝试使用 position:absolute 时，它​​搞砸了页面上的其他元素，所以这也是不可能的。如果您知道此问题的解决方案，请告诉我。

4

2 回答 2

1

您可以使用相对位置 DIV 围绕元素，然后您可以使用 position:absolute 元素内容。

<div style="position:relative">
   <div class="content"><img /></div>
</div>
于 2012-05-09T23:31:45.297 回答
1

我尝试按照您的解释进行操作。我不是 100% 确定我是否理解您的问题，但似乎您的问题可以通过为较小的窗口尺寸应用不同的 css 来解决。这是一个例子：

@media only screen and (max-width: 480px) {
    .content {
       // whatever css you want to put here for window sizes smaller than 480px 
    }
}
于 2012-05-09T23:47:47.187 回答