定位问题涉及较小的显示器

Question

这个设置，我的27英寸显示器上的图像画廊看起来很正常，它位于我的身体中心。但是当我在我的15英寸显示器上看它时，它距离对。现在，我知道它与“gallery”css有关，因为div可能会将它推向右边。我的问题是，尽管显示器的宽度不同，是否还有一种更有效的方法可以保持静止？我对两列的布局前景感到有些困惑，看看它是如何不会移动到之前定位的位置。

<div id="gallery">
<div class="html5gallery" data-width="400" data-height="225" style="display:none>
<img src="images/mr.magic.jpg" alt="Mr. and Mrs. Magic">
<img src="images/mr-magic-2.jpg" alt="Mr. and Mrs. Magic">
<img src="images/mr-magic-3.jpg" alt="Mr. and Mrs. Magic">
<img src="images/mr-magic-4.jpg" alt="Mr. and Mrs. Magic">
<img src="images/mr-magic-5.jpg" alt="Mr. and Mrs. Magic">
<img src="images/david.jpg" alt="Mr. and Mrs. Magic with David Copperfield">
<img src="images/david-2.jpg" alt="Mr. Magic with David Copperfield">
<img src="images/seigfried.jpg" alt="Mr. Magic with Seigfried and Roy">
</div>
</div>

#gallery {
position: relative;
left: 950px; 
top: -560px;
float: left; padding:0; margin:0 
}

我很感谢你们花时间去研究这些问题，并希望得到一个好的答案。感谢您抽出宝贵时间阅读本文。

Answer 1

我不擅长CSS但是......

left：950px意味着div总是从父div的左侧950px（屏幕可能在你的情况下）。因此，在较小的屏幕上，它将显示在右侧。

相反，尝试使用％或px设置div的宽度，然后将左右边距设置为自动。类似的东西：

#gallery {
position:relative;
width:50%;
margin: 0 auto;
top:-560px;
}