css - 如何在固定宽度的盒子内居中改变宽度的盒子？

Question

我正在一个网站上工作:http://felipewarrener.55freehost.com

如您所见，有一个内容 slider ，我添加了媒体查询以缩小文本并按比例缩放框的宽度(我最终会将文本做得足够小，这样框就不会比容器大分区

但是，我不知道如何让这些框垂直居中？当我缩小它时，它们需要垂直居中，否则它们会向下 float 。

他们相对定位，因为我觉得这是最好的选择

谁能建议或告诉我应该使用什么方法？

感谢您花时间阅读

费利佩

Answer 1

你可以使用flex

.container { 
display: flex; 
flex-wrap: wrap; 
justify-content: center;
align-items: center;
align-content: center; 
width: 400px;
height: 400px;
border: 1px solid black;
}
.content {
  width: 200px;
  height: 200px;
  background-color: green;
}

<div class="container">
  <div class="content">
  </div>
</div>