Html 中间div在div中

我找了很多，但没有找到任何解决办法

这是我的HTML代码：

<div class="col-lg-4">
   <div class="icon-container">
      <div class="icon">
          <h1>10C</h1>
      </div>                    
   </div>
     <h2>text</h2>
</div>

col-lg-4类来自bootsrap。 好的，我想把icon类放在icon容器的中心，还有icon h1放在icon里面。 我希望你能理解

---

div图标上方的代码在div图标容器中不居中。重要的是我不要修改两个div的宽度和高度。

margin:0 auto

-只需使用

margin:0 auto这将适用于许多事情！祝你好运

.icon-container{
    height:160px; 
    width:160px;    
    display:inline-block;
}

.icon{
    background: url(image/template.png);
    height:140px; 
    width:140px;
    border-radius: 50%;
    cursor: pointer;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.icon h1{
    color: white;
    text-align: center;
}

另外，请不要使用
color:white
，快速谷歌会显示某些浏览器可能有特定的颜色定义，例如
blue
在某些浏览器中可能看起来不同。对于
white
，情况并非如此，但仍然如此。
您只需在classe图标的css中添加一个“Margin:auto”；如果它不起作用，我建议使用“identificates（id）”，这说明引导保存了许多可能会混淆系统的类。图标{margin:auto；}
您可以在引导中使用它：

<div class="col-lg-4">
   <div class="icon-container">
      <div class="icon center">
          <h1>10C</h1>
      </div>                    
   </div>
     <h2>text</h2>
</div>


10C
文本
希望这能奏效：）


.icon容器{
高度：160px；
宽度：160px；
显示：内联块；
边框：3倍纯黑；
位置：相对位置；
}
.图标{
背景：url（image/template.png）；
高度：140像素；
宽度：140px；
边界半径：50%；
光标：指针；
垂直对齐：中间对齐；
边框：2件纯黑；
文本对齐：居中；
位置：相对位置；
保证金：自动；
边缘顶部：8px；
}
.图标h1{
颜色：黑色；
}


Text1
文本2
或者，我们可以停止鼓励人们使用过时的方法，因为它们是一种快速修复方法，是我们无知的面具。此外，要居中放置H1标记，只需添加：text align:center；到元素。但是标签应该居中。正如@ShowTime所说的，最好鼓励使用现代的标准方法，而不是过时的方法。这将使OP的代码无法通过w3c验证。
margin:0 auto
是正确的go@ChenAsraf-嘿，伙计们，是的，我明白。但这只是一个选择！我个人使用边距法，这就是为什么我写下它！通过JSFIDLE运行您的方法将很快显示它不起作用。注意，他使用的是
display:inline block
他使用的是
display:inline block
，这不会相应地起作用。lNice但是如果我想制作javascript动画？例如，当我单击图标容器时，将圆圈从140px扩展到160px，您可以使用css中的scale（）实现这一点。无论如何，欢迎！
<div class="col-lg-4">
   <div class="icon-container">
      <div class="icon center">
          <h1>10C</h1>
      </div>                    
   </div>
     <h2>text</h2>
</div>