中心自舉容器流體水平

我怎麼能水平居中我的主容器，使用切除自舉類中心自舉容器流體水平

這裏是容器：

<div class="container-fluid main-container"> 
     <div class="col-md-10 content"> 
      <div class="panel panel-default"> 
       <div class="panel-heading"> 
        Edit existing questions 
       </div> 
       <div class="panel-body"> 
       </div> 
      </div> 
     </div> 
    </div>

The way it looks now

來源

2017-08-01 jimiss

可能重複的[容器流體不居中]（https://stackoverflow.com/questions/36943368/container-fluid-not-centered） – Gerard

在這裏，你去了一個解決方案https://jsfiddle.net/w4gLtcz5/1/

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="container-fluid main-container"> 
 
    <div class="row"> 
 
    <div class="col-md-offset-1 col-md-10 content"> 
 
     <div class="panel panel-default"> 
 
      <div class="panel-heading"> 
 
      Edit existing questions 
 
      </div> 
 
      <div class="panel-body"></div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

在引導，通過默認有12列。

由於您的容器是，所以佔用12列中的10列，因此從2列開始您的容器而不是第1列。因此，在容器兩側您都有相同的空間。

我認爲COL-MD-10是你我加入COL-MD-偏移1列

的數量。

來源

2017-08-01 08:56:12 Shiladitya

aaaa ..不工作，不知道是否有更新或更新。鉻風10 – Sangoku

@三國你得到什麼錯誤？請解釋這個問題。 – Shiladitya

https://i.stack.imgur.com/qBF1R.png 它只是直起來不起作用在我的電腦上fidget。 – Sangoku

請使用COL-XS -offset-x 代替x，您可以寫入1到12之間的數字。

Mo右列使用.col-md-offset- *類。這些類將列的左邊距增加*列：

您的代碼將會是。

<div class="container-fluid main-container"> 
    <div class="col-md-10 content col-xs-offset-2"> 
     <div class="panel panel-default"> 
      <div class="panel-heading"> 
       Edit existing questions 
      </div> 
      <div class="panel-body"> 
      </div> 
     </div> 
    </div> 
</div>

參考鏈接https://www.w3schools.com/bootstrap/bootstrap_grid_examples.asp

來源

2017-08-01 08:53:04 Harsh

中心自舉容器流體水平

回答

相關問題