2016-08-19 53 views
2

那麼,把這段內容分成兩部分,即col-md-6,只是它們沒有集中在網站上,儘管處於中間位置,它們放在左邊,離開右側有點空虛。遵循div的代碼。Centering divs - Bootstrap

<div class="content"> 

    <div class="container clearfix"> 
         <div class="col-md-6 configdiv"> 
          <img src="/layout/images/imagem1.png" /> 
          <h5>TITULO 1</h5> 
          <p> 
          Oi, tudo bem? Oi, tudo bem? Oi, tudo bem? 
          Oi, tudo bem? 
          Oi, tudo bem? 
          <p> 
          <div> 
           <img src="/layout/images/iconemail.png" /> 
           <img src="/layout/images/iconefb.png" /> 
           <img src="/layout/images/iconett.png" /> 
          </div> 
         </div> 
         <div class="col-md-6 configdiv"> 
          <img src="/layout/images/imagem2.png" /> 
          <h5>TITULO 2</h5> 
          <p> 
           Oi, tudo bem? 
          <p> 
          <div> 
          <img src="/layout/images/iconemail.png" /> 
          <img src="/layout/images/iconefb.png" /> 
          <img src="/layout/images/iconett.png" /> 
          </div> 
         </div> 
    </div> 

</div> 

而CSS是這樣的:

.configdiv {border: 1px solid #DDDDDD; 
      margin-right: 28px; 
      margin-bottom: 25px; 
      padding: 10px; 

記住這兩個div AL-MD-6,是由側方,我想被集中在屏幕上!內容內容:

Content----------------------------------------------------*/ 
    #content { 
position: relative; 
overflow: hidden; 
background-color: #FFF; 
} 

#content p { line-height: 1.8; } 

.content-wrap { 
position: relative; 
padding: 80px 0; 
} 

#content .container { position: relative; } 

回答

2

你需要用.row類來包裝在<div>你列,.col-md-6。 Bootstrap的工作方式需要將所有列包裝在一行中。

<div class="row"> 
 
    <div class="col-md-6"></div> 
 
    <div class="col-md-6"></div> 
 
</div>