参见英文答案 >
How to center a flex container but left-align flex items 1个
我在代码段显示时成功创建了一个响应式网格.
此刻,我看到盒子左边对齐了.
如何在不使用填充的情况下将容器放在页面的中心?
我尝试使用margin:auto但它没有用.
.container{
display:flex;
flex-wrap:wrap;
text-align:center;
margin:auto;
}
.box{
width:100%;
max-width:30%;
border:1px solid red;
margin:5px;
}
@media only screen and ( max-width:768px ){
.box{
width:100%;
max-width:40%;
border:1px solid red;
}
}
This is the first box
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci voluptates, aut totam eaque possimus molestiae atque odio vero optio porro magni, quis culpa ea. Perferendis, neque, enim. Rem, quia, quisquam.