一些具有不同内容的内联块 div 的垂直对齐答案

【问题标题】：vertical align of some inline-block divs with different content一些具有不同内容的内联块 div 的垂直对齐
【发布时间】：2014-08-03 08:22:30
【问题描述】：

我想将一些内联块 div 居中。我想创建一个响应式设计，所以如果屏幕尺寸太小，水平元素应该在彼此之下。

我怎样才能使它们垂直居中，使它们并排而没有高度差异？（见小提琴）。

如果屏幕尺寸太小，移动这些元素应该垂直居中。

http://jsfiddle.net/5dpRs/52/

CSS

.repeat
{
    display:inline-block;
    border-style:solid;
    border-width:2px;
    height:50px;
    width:50px;
}


#content
{   
    border-style:solid;
    border-width:2px;
    text-align:center;
}

HTML

<div id="content">
    <div class="repeat">
        <p>hello</p>       
    </div>
    <div class="repeat">
    </div>
</div>

谢谢你:)

【问题讨论】：

标签： html center vertical-alignment css

【解决方案1】：

试试这个：

vertical-align:middle;

Working Fiddle

【讨论】：