2

我想在页面中间有一个面板，但是当我将页面调整为小于面板宽度时，我希望面板位于 0 的 x-pos 处。即。当调整到小于面板宽度时，面板不会从屏幕左侧推出。

例如，下面的代码很好地将面板放置在中间，但是当浏览器的大小调整为小于面板的宽度时，它会从浏览器的左侧推开。

在这种情况下，有什么方法可以强制面板保持在 0px 左侧位置？

<div style="position:fixed; width:800px; top:0px; left:50%; margin-left:-400px;">
  content
</div>
4

3 回答 3

2

你可以使用媒体查询，fe

@media (max-width: 800px) { /* this has to be the same width as the div */
    div {
        margin-left:0;
        left:0;
    }
}

http://jsfiddle.net/y3zpm/

于 2013-08-15T12:45:34.300 回答
1

我发现这个页面有很好的例子：http ://codepen.io/shshaw/full/gEiDt#Fixed 。为我工作！

于 2013-08-15T12:46:10.283 回答
0 
<div style="margin:auto; width:800px; top:0px;">
  content
</div>
于 2013-08-15T12:46:22.303 回答