col-md-6으로 div를 정렬하는 방법은 무엇입니까?

나는col-md-6으로 div를 정렬하는 방법은 무엇입니까?

<div class="container"> 
    <div class="row"> 
    <div class="wpb_column vc_column_container col-md-6"> 
     <div class="vc_column-inner "> 
     <div class="wpb_wrapper"> 
      <div class="event-wrapper featured-event "> 

      <!-- the loop --> 
      <div class="upcoming-campaign"> 
       <img width="555" height="400" src="http://andrejceccoli.com/wp-content/uploads/2016/10/elezioni_sfondo.jpg" class="img-responsive wp-post-image" alt="Elezioni Politiche"> 
       <div class="campaign-scoop"> 
       <h3 class="title"><a href="http://trendytheme.net/demo2/wp/nominee/onepage/event/election-campaign/">Elezioni Politiche</a></h3> 

       <span class="start-date">Inizia il: <span class="colored">20 Nov 2016</span></span> 

       <div class="countdown-wrapper"> 
        <ul class="countdown list-inline" data-countdown="2016-11-20"> 
        <li><span class="days">38<span><p>Days</p></span></span> 
        </li> 
        <li><span class="hours">07<span><p>Hour</p></span></span> 
        </li> 
        <li><span class="minutes">48<span><p>Minutes</p></span></span> 
        </li> 
        <li><span class="second">12<span><p>Second</p></span></span> 
        </li> 
        </ul> 
       </div> 
       <address><i class="fa fa-map-marker"></i>San Marino</address> 
       <span class="event-duration colored"><i class="fa fa-clock-o"></i>08:00 AM - 23:00 PM</span> 
       </div> 
       <!-- .campaign-scoop --> 
      </div> 
      <!-- .upcoming-campaign --> 
      <!-- end of the loop --> 
      </div> 
     </div> 
     </div> 
    </div> 
    </div> 
</div>

출처

2016-10-12 poopp

당신은 부트 스트랩을 사용하고 있습니까? – Fralec

jsfiddle 제공 –

'col-md-6' 다음에'.col-aligncenter {float : none; margin : 0 auto;}'와 같은 CSS 클래스를 선언하고'.col-aligncenter'를 삽입하십시오. –

는 col-md-offset-3 클래스를 추가 중앙에 내가 중앙에 시간을 표시 태어나 셨 왼쪽에 나에게 타이머를 표시 이것은 코드 class="col-md-6"

와 사업부를 표시 할 필요가 부트 스트랩에 12 열 그리드가 있으면이 열은 col-md-6 요소를 가운데에 놓습니다.

Documentation reference on offsets.

출처

2016-10-12 15:23:06

나는 당신이 wordpress를 사용하고있는 것을 본다. 그리고 배치 한 코드가 제대로 끝나지 않습니다. 내가 틀렸어도 col-md-6의 다른 부분이 있습니다. 이렇게 쉽게 센터에서 시간을 설정할 수 있습니다. .upcoming-campaign {text-align : center; } 이것을 추가하십시오. 어떤 질문이라도 나에게 의견을 묻는다면.

.upcoming-campaign { 
 
    text-align: center; 
 
}

<head> 
 

 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 

 
</head> 
 

 
<body> 
 
    <div class="container"> 
 
    <div class="row"> 
 
    <div class="wpb_column vc_column_container col-md-6"> 
 
     <div class="vc_column-inner "> 
 
     <div class="wpb_wrapper"> 
 
      <div class="event-wrapper featured-event "> 
 

 
      <!-- the loop --> 
 

 
      <div class="upcoming-campaign"> 
 
       <img width="555" height="400" src="http://andrejceccoli.com/wp-content/uploads/2016/10/elezioni_sfondo.jpg" class="img-responsive wp-post-image" alt="Elezioni Politiche"> 
 
       <div class="campaign-scoop"> 
 
       <h3 class="title"><a href="http://trendytheme.net/demo2/wp/nominee/onepage/event/election-campaign/">Elezioni Politiche</a></h3> 
 

 
       <span class="start-date">Inizia il: <span class="colored">20 Nov 2016</span></span> 
 

 
       <div class="countdown-wrapper"> 
 
        <ul class="countdown list-inline" data-countdown="2016-11-20"> 
 
        <li><span class="days">38<span><p>Days</p></span></span> 
 
        </li> 
 
        <li><span class="hours">07<span><p>Hour</p></span></span> 
 
        </li> 
 
        <li><span class="minutes">48<span><p>Minutes</p></span></span> 
 
        </li> 
 
        <li><span class="second">12<span><p>Second</p></span></span> 
 
        </li> 
 
        </ul> 
 

 
       </div> 
 

 
       <address> 
 
       <i class="fa fa-map-marker"></i>San Marino        
 
      </address> 
 

 
      
 

 
<span class="event-duration colored"><i class="fa fa-clock-o"></i>08:00 AM - 23:00 PM</span> 
 
       </div> 
 
       <!-- .campaign-scoop --> 
 
      </div> 
 
      <!-- .upcoming-campaign --> 
 

 
      <!-- end of the loop --> 
 

 

 
      </div> 
 
      <!-- end of event-wrraper --> 
 
     </div> 
 
     <!-- end of wpb-wrapper --> 
 
     </div> 
 
     <!-- end of vc_colum-inner --> 
 
    </div> 
 
    <!-- end of col-md-6 [1] --> 
 

 
    <div class="wpb_column vc_column_container col-md-6"> 
 
     <div class="vc_column-inner "> 
 
     <div class="wpb_wrapper"> 
 

 

 
     </div> 
 
     <!-- end of wpb-wrapper --> 
 
     </div> 
 
     <!-- end of vc_colum-inner --> 
 
    </div> 
 
    <!-- end of col-md-6 [2] --> 
 

 
    </div> 
 
    <!-- end of Row --> 
 
</div> 
 
<!-- end of the Container --> 
 

 
</body>

출처

2016-10-12 17:07:37

col-md-6으로 div를 정렬하는 방법은 무엇입니까?

답변

관련 문제