中心倍数div数计数器

Center multiple div number counter

我已经看了很多东西并尝试了几种不同的代码,但对我来说没有任何效果..

我有这个网站,我想把这个数字计数器放在中间。

我试过了,text-align,margin 0 auto 但没有任何效果,或者我输入错误的地方。

这是它的样子:

这是 HTML:

<section class="bg-primary" id="about">
        <div class="container">
            <div class="row">
                <div class="col-lg-8 col-lg-offset-2 text-center">
                    <h2 class="section-heading">We've got what you need!</h2>
                    <hr class="light">
                    <p class="text-faded">We are a creative staffing agency that gets your brand in front of your core audience, for a one-to-one interaction. Creating an impactful and eganging brand experience.</p>
                    <div id="shiva"><span class="count">300</span></div>
                    <div id="shiva"><span class="count">78</span></div>
                    <div id="shiva"><span class="count">32</span></div>
                </div>
            </div>
        </div>
    </section>

和 CSS:

#shiva

{

    margin: 25px;
    float: left;
}



.count
        {

  line-height: 100px;
  color:black;
  font-size:50px;
}

应该这样做:

<div id="container">
    <div id="shiva"><span class="count">300</span></div>
    <div id="shiva"><span class="count">78</span></div>
    <div id="shiva"><span class="count">32</span></div>
</div>

#container {
    width: 100%;
    text-align: center;
}

试试下面的方法

<div class="c">
    <div id="shiva"><span class="count">300</span></div>
    <div id="shiva"><span class="count">78</span></div>
    <div id="shiva"><span class="count">32</span></div>
</div>

.c {
    width: 350px;
    margin:0 auto;
}

https://fiddle.jshell.net/zmtLatn9/

你可以试试这个……

<div class="parent">
     <div id="shiva"><span class="count">300</span></div>
     <div id="shiva"><span class="count">78</span></div>
     <div id="shiva"><span class="count">32</span></div>
</div>

.parent {
    margin:auto;
    display:table;
}