如何在 CSS 中将元素浮动到中心？答案

【问题标题】：How to float elements to the center in CSS?如何在 CSS 中将元素浮动到中心？
【发布时间】：2015-11-19 19:05:44
【问题描述】：

编辑：我根本无法修改 HTML 页面，否则我会自动得到 0。

我的教授刚刚给了我们这个任务，我们将 CSS 添加到 HTML 页面。我们必须按照屏幕截图，使用右边距、内边距、边框、宽度和高度。

对于多列，他希望我们使用float，这一切都很好，花花公子，但是需要向左浮动3列，然后在页面中居中。

所以虽然屏幕截图看起来像这样：

我的实际项目如下所示：

我应该如何浮动这些列并保持居中？

我已经为 section#featured 设置了 text-align，但这只是使文本居中，而不是元素。我不能使用display 属性，否则我会被扣分。在其他屏幕截图中，他没有为列指定任何边距或填充，因此它们就是它们。

顺便说一下，它们是浮动到左侧的div 元素，因此它们的默认显示为block。设置自动边距没有任何作用。

有什么想法吗？我应该坚持他并使用display而不是float吗？因为这实际上有效。

【问题讨论】：

【解决方案1】：

看图。

创建一个容器来表示深蓝色/紫色轮廓。给它一个尺寸。居中。

在该容器内排列三个并排的元素。

【讨论】：

这个答案可能是截图中上面的布局（标题和四列）也起作用的原因。
我忘了说我不能编辑 HTML，否则我会自动得到一个 0。老实说，这个教授是真正的白痴。
图表本身令人困惑。我将每列设置为 350px 宽，高度是自动的。父元素的高度是自动的，我将其设置为 1130px。（我指的是绿色容器，因为它看起来像是父元素）
啊等等。我在想错误的元素。我没有将父级设置为 1130 像素。完全被忽视了。考虑到我在技术上什至没有给父母一个尺寸的事实，将您的答案标记为正确。因此，一旦我将其精确设置为 1130 像素，自动边距就会居中。完美！

【解决方案2】：

您可以将您的元素放在div 中并使用css 将其居中

#my_div {
    display: table;
    margin: 0 auto;
}

【讨论】：