关于bootstrap 居中

Question

初学bootstrap，对这个东西不太了解。
现在想把一个login-wrap在div里居中。
以前都是随手一个margin: 0 auto;就解决的事，现在搞了半天也不行。。。

<div class="container-fluid body-wrap">
    <div class="row-fluid">
        <div class="col-sm-0 col-md-12 bg-wrap">
            <img class="bg-computer" src="/images/firmware-download/computer@2x.png">
            <div class="row-fluid">
                <div class="col-sm-12 col-md-3 login-bg">
                    <img class="around" src="/images/firmware-download/around@2x.png">
                    <ul class="list-unstyled login-wrap">
                        <li class="title">DOWNLOAD</li>
                        <li class="small-title">飞马测试固件下载中心</li>
                        <li><input class="login-input" placeholder="密码" onfocus="if(placeholder=='密码') {placeholder=''}" onblur="if (value=='') {placeholder='密码'}"><img class="login-btn" src="/images/firmware-download/shape@2x.png"></li>
                    </ul>
                </img>
            </div>
        </div>
    </div>
</div>

.row-fluid {height: 100%;}
.body-wrap {
    height: 100vh;
    padding-left: 0; padding-right: 0;
    .bg-wrap {
        background: no-repeat url(/images/firmware-download/bg@2x.png); background-size: cover; background-position: center;
        height: 100%;
        padding-right: 0; padding-left: 0;
        .bg-computer {
            width: 49%;
            min-width: 400px;
            position: absolute;
            right: 18%;
            top: 17%;
            animation: move 4s ease-in-out 1s infinite alternate;
            @keyframes move{
                from {top: 17%;}
                to {top: 20%;}
            }
        }
    }
    .login-bg {
        background-color: #102397;
        height: 100%;
        padding-right: 0; padding-left: 0;
        .around {
            z-index: 1;
            width: 66%;
            position: absolute;
            bottom: 0;
            left: 0;
        }
        .login-wrap {
            z-index: 999;
            text-align: center;
            display: block;
            width: 240px;
            //margin-left: auto;
            //margin-right: auto;
            position: relative;
            margin: auto; margin-left: 0; margin-right: 0;
            padding-top: 40vh;
            .title {font-size: 36px; color: #ffffff;}
            .small-title {font-size: 18px; letter-spacing: 2px; color: #ffffff;}
            .login-input {
                height: 33px;
                margin-top: 57px;
                background-color: transparent;
                border: solid 2px #ffffff;
                border-top: 0; border-left: 0; border-right: 0;
                text-align: center;
                color: #ffffff;
                font-size: 13px;
            }
            .login-btn {
                width: 14px;
                height: 14px;
                margin-left: -14px;
            }
        }
    }
}

目前百度到用margin-left:auto;margin-right:auto;可以成功，但是不能设置absolute定位，导致缩放后.around设置的absolute定位把他挡住了。。。z-index也要在绝对定位下才起作用。。。

Answer 1

position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto