如果有足够的空间，我如何在页面中间居中网格

Question

.content{
display: grid;
grid-template-columns: repeat(auto-fill, 21.25em);
gap: 20px;
justify-content: center;
align-content:center;
align-items:center;
}

我为一节中的三张卡片制作了这个网格，我意识到我的网格工作得很好，但当我缩小时，我看到网格在页面的左侧，而不是居中。将这些网格项居中的常用方法是什么？我应该把它们放在contaier中吗？或者有没有一种方法可以使整个页面居中，或者有网格功能？

Answer 1

如果您使用Bootstrap，只需在带有class="文本中心"；。以下示例：

<div class="text-center">
<table>...</table>
</div>