如何使用col-md-6将div居中? [英] How to center div with col-md-6?
本文介绍了如何使用col-md-6将div居中?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我需要使用class="col-md-6"
这是代码,向我显示左侧的计时器,以在中心显示时间
This is the code, that display me the timer at the left I nee to display time in the center
<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>
推荐答案
引导程序3
添加col-md-offset-3
类,该类将偏移3列,因为Bootstrap具有12列网格,这将在中央放置一个col-md-6
元素.
Add the col-md-offset-3
class that will offset by 3 columns, given that Bootstrap has a 12-column grid this will put a col-md-6
element right in the center.
引导程序4
使用offset-3
或mx-auto
将col-md-6
列居中
这篇关于如何使用col-md-6将div居中?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文