Question

我正在使用bootstrap并创建一个面板。我正试图将我的面板放在屏幕中间。它在容器内。

<div class="container body-content">
    <div class="panel panel-default col-md-6">
        <div class="panel-title text-center">Log in</div>
        <div class="panel-body text-center">
             <h6>Use a local account to log in.</h6> 
        </div>
    </div>
</div>

Answer 1

这是一种方法：

Example Here

.container .panel {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}

如果您对其他方法感兴趣，see this answer。

Answer 2

对于像我这样的人来说，只是水平而不是垂直地看中心面板，col-xx-offset是一种水平居中面板的快捷方式。

<div class="panel panel-default col-md-6 col-md-offset-3">

请参阅this回答

将一个面板放在屏幕上

2 个答案: