Question

我是HTML和CSS的新手，我一直在试图弄清楚如何将这个名为.content的div类置于包围我的表数据的页面中间。我已经google了，我发现我应该将左边距设置为0而将右边距设置为auto但是当我这样做时我得到的是整个桌子保留在左侧页面。

现在我margin-left 500px试图让它靠近页面中心，但我想如果我这样做，它将不会集中在其他不同的屏幕上无论屏幕尺寸是多少，我都希望它能够集中在一起。

HTML

<body>
    <h1>Table</h1>
    <div class="content">
        <table>
            <tr>
                <th>Data</th>
                <th>Data 2</th>
                <th>Data 3</th>
            </tr>
            <tr>
                <td>Data 1</td>
                <td>Data 2</td>
                <td>Data 3</td>
            </tr>
        </table>
    </div>
</body>

CSS

body {
    border: 1px;
    border-color: black;
    border-style: dashed;
}
h1 {
    border: 1px;
    border-color: green;
    border-style: dashed;
    color: red;
    text-align: center;
}
.content {
    border: 1px;
    border-color: orange;
    border-style: dashed;
    color: red;
    display: inline-block;
    margin_right: auto;
    margin-left: 500px;
    text-align: center;
}
.content th {
    border: 1px;
    border-color: green;
    border-style: dashed;
}
.content td {
    border: 1px;
    border-color: red;
    border-style: dashed;
    color: blue;
}

Answer 1

居中意味着左右边距相等。因此，侧边距应设置为auto，如下所示：

.content {margin：0 auto}

...其中0是顶部和底部的边距，auto是左右边距

我也从那里删除了内联块。

Answer 2

由于.content没有固定的宽度，因此您无法使用margin:0px auto来固定内容。在你的情况下，你可以在table元素上像这样：

table{
    margin:0px auto;
}

但您需要从display:inline-block移除.content才能使其生效。

Answer 3

将.content更新为

SSL_CTX_load_verify_locations

然而，这会使水平居中的.content对齐，但如果你想在垂直居中的.content那么

SSL_CTX_load_verify_locations(ctx, "rootcert.pem", "rootkey.pem") != 1)

Answer 4

在您的情况下，最好的解决方案是调整两个＆＃34;边距＆＃34;来自以下内容的.content类声明中的属性：

保证金左：500像素; margin_right：auto;

要：

保证金左：汽车;余量右：汽车;

请注意＆＃34; margin_right＆＃34;需要一个连字符（＆＃39; - ＆＃39;）而不是下划线。

需要帮助将div类放在页面上

4 个答案: