html - 在响应式 div 中居中 div

Question

基本上我有 3 个 float 元素，它们彼此相邻，并在您调整浏览器窗口大小时按比例缩小。现在在一定宽度下 (@media (max-width: 800px)) 元素获得固定宽度和 clear:both 以便它们位于彼此下方并且不再缩放。

我现在要做的是将这 3 个 div 置于其父元素的中心。

margin:0 auto 没有帮助

800像素以上宽度:

800 像素宽度以下:

--> div应该在黄色的里面居中

媒体查询代码:

@media (max-width: 800px){
.data .data_column{width:215px;background-color:red;clear:both; margin: 0 auto;}
.data{width:90%;background-color:yellow;}

Answer 1

将 clear:both 替换为 float: none 应该足以让 margin: auto 完成工作。