Question

我无法弄清楚如何在此页面上排列div，以便它们居中而不是左对齐。此外，我想在角落覆盖一个锁定图标。我能够在那里得到它，但我希望它不会影响图像的实际大小，而是重叠而不是......这里是CSS和HTML的小提琴：

jsfiddle.net/bpalmer318/tpb2c7un/1 /

总结：如何将所有页面内容居中，如何在不使底部图像变小的情况下叠加第二张图像？（注意**使用的图像只是NFL徽标，但稍后会出于商业目的使用公司徽标）

我希望这篇文章可以向其他人展示如何制作带有重叠图像的复杂div页面

感谢您的帮助！

Answer 1

您无法居中float元素。

此处使用inline-block

demo

Answer 2

有很多方法可以使页面内容居中。这里只有一个：

在html页面上：

<div id="center">your content here</div>

关于css：

  #center{

width:85%;
margin-left:auto;
margin-right:auto;

}

当然，应该根据您的需要调整行程我已经在您的示例中尝试了这个，并且它似乎看起来居中。尽量让百分比与内容相同（或者更多一点）。

希望它有所帮助。

您还可以看到此帖子可能会为您提供指导：How to horizontally center a <div> in another <div>?