css - 根据每个浏览器中的屏幕分辨率将 div 放置到屏幕中心

Question

如何将容器水平放置到屏幕中心。容器有 8 个要放置的图像。所有图像都将对齐到一条线，并应根据屏幕分辨率进行相应更改。

这是我的 HTML

<div id="container">
    <div id="list"   >
        <img src="img/c1.png" style="display:box; width:125px; margin-left:5px; margin-top:9px" />
        <img src="img/c2.png" style="display:box; width:125px;margin-left:5px;margin-top:9px"/>
        <img src="img/c3.png" style="display:box; width:125px;margin-left:5px;margin-top:9px" />    .
        .
        .
    </div>
</div>

CSS：

#container{margin-left: auto;margin-right:auto;width:1200px;}

Answer 1

在这里，您改进的 CSS

在这里，图像将表现为文本，因此此代码非常适合您的要求。（如果某些事情没有按您的意愿工作，只需留下您的 HTML 和 CSS 的 jsfiddle 以便我们可以查看实时代码。）

#container {
    position: relative;
    margin: auto;
    width:1200px;
}

#list img {
    display: inline-block;
}

#list {
    vertical-align: middle;
    text-align: center;
}