背景画像ブートストラップフルスクリーンなし

Question

こんにちは私はコンテナより広い背景画像を作ることで問題を解決できません。

イメージで設定を変更すると、入力フォームの縦方向の中央揃えが失われます。それがどうあるべきか

参照画像：

.container-table { 
 
    display: table; 
 
    height: calc(100vh - (45px + 35px)); 
 
    background: url("http://dummyimage.com/600x400/000/fff") no-repeat; 
 
    background-size: cover; 
 
    background-position: center; 
 
} 
 
.vertical-center-row { 
 
    display: table-cell; 
 
    vertical-align: middle; 
 
} 
 
.submitbutton { 
 
    border-radius: 0; 
 
    transform: scaleX(-1); 
 
    background-color: #0c8484; 
 
} 
 
.form-control { 
 
    border-radius: 0; 
 
    font-size: 40px; 
 
} 
 
.fa-search { 
 
    color: #e1f0f0; 
 
}

<div class="container container-table"> 
 
    <div class="row vertical-center-row "> 
 
    <div class="col-lg-offset-2 col-lg-8"> 
 
     <div class="logo"> 
 
     <p class="logoname">LOGO</p> 
 
     </div> 
 
     <div class="input-group"> 
 
     <input type="text" class="form-control input-lg"> 
 
     <span class="input-group-btn"> 
 
      <button class="btn btn-lg submitbutton" type="button"> 
 
      <i class="fa fa-search"></i> 
 
      </button> 
 
     </span> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

Answer 1

あなただけの親のdivにコンテナ流体クラスとコンテナクラスを置き換えることができます。幅 変更：100％副作用があります。..

<div class="container container-table">  /* Original */ 
<div class="container-fluid container-table"> /* Modified */