css - 将 div 内的每个元素垂直居中

Question

这是我的问题的示例演示

http://www.bootply.com/tkrs6G3GlG

基本上，我在左边的表单组中，在每个组中我都有大文本提供一些信息，然后要求用户选择一些东西(例如只有 radio ，但也有下拉菜单和复选框) .我希望对于每个表单组，右侧的选项根据文本大小垂直对齐(在中间)。在上面的示例中， radio 位于顶部，但我希望它们位于相应表单组的中间。

我试过了

  .vcenter{vertical-align:middle;
     }

但它不起作用。我也试过设置包含选项的 div 的高度

 .maxHeight{
       height:100%;
 }

但是div并没有变大。我尝试使用大高度和 overflow hidden ，但没有用。到目前为止唯一有用的是使用

.vcenter{
      position:absolute;
      vertical-align: middle;
 }

但它只在大屏幕上看起来不错，但在屏幕调整大小后，它与文本重叠。

Answer 1

如果您的 div 在另一个 div 中，请尝试

#my_div{
       margin-left: auto;
       margin-right: auto; 
       width: /*put_your_width*/;
}

如果是parent div

   #my_div{
         display: table;
         margin-right: auto;
         margin-left: auto;
   }