基于媒体查询动态地将元素放在屏幕中间

Question

我正在开发一个适合任何类型的设备屏幕的响应式网站 问题是现在每个设备都有不同的像素，我希望它动态放置让我们说div到屏幕中间。

目前我正在使用margin-left：xxpx进行调整.. 对于智能手机或平板手机或平板电脑而言，每种设备的结果都不同。

我应该使用“％”代替保证金吗？如果没有，有人可以告诉我更好的方法吗？

Answer 1

没有看到你的代码，很难说。

通常，您可以将元素置于绝对位置，然后执行left:50%;并将margin-left设置为元素宽度的负50％（即，如果您的元素为250像素，则设置为margin-left:-125px; ）。如果元素具有指定的宽度，则可以执行margin:0 auto;，否则text-align:center;也可以正常工作，这取决于您的代码。

Answer 2

margin:0 auto;将以div为中心。您也可以为div指定width，否则宽度为100％。

您可以使用媒体查询更改宽度（或使用基于％的宽度）并保留margin: 0 auto。

示例：

.center {
    margin:0 auto;
    width: 30%;
}