html - 高さを設定するには？

Question

HTML:

<div class="spoiler-content-block">
    <div class="spoiler-inner-content-block">
        <div class="top-block top-block-tight">
            Name
        </div>
        <div class="bottom-block">
            <span class="previous-number">0</span>
        </div>
    </div>
    <div class="spoiler-inner-content-block">
        <div class="top-block">
            Time of last login
        </div>
        <div class="bottom-block">
            <br>
            <span class="previous-number">0</span>
        </div>
    </div>
    <div class="spoiler-inner-content-block">
        <div class="top-block top-block-tight">
            Status
        </div>
        <div class="bottom-block">
            <span class="current-number">0</span><br>
            <span class="previous-number">0</span>
        </div>
    </div>
</div>

CSS:

div.spoiler-content{
    border: 1px solid #DDDDDD;
    padding: 10px;
    white-space: nowrap;
    text-align:center;
}

div.spoiler-content-block{
    display: inline-block;
    border:1px solid #ececec; 
    white-space: normal; 
    padding: 5px;
    text-align: center;
    vertical-align: middle;
}

div.spoiler-inner-content-block{
    display:inline-block;
    white-space: nowrap;
}

.top-block{
    border: 1px solid #ececec;
    padding: 5px;
    margin-bottom: 5px;
    height: 30px;
}

.bottom-block{
    border: 1px solid #ececec;
    padding: 5px;
}

例: http://jsfiddle.net/nonamez/aGQ8F/

問題は<div class="bottom-block">- 1 つの値がある場合、それを修正するにはどうすればよいですか?

Answer 1

を追加してみvertical-align:topてくださいdiv.spoiler-inner-content-block

div.spoiler-inner-content-block{
    display:inline-block;
    white-space: nowrap;
    vertical-align:top;
}

私はあなたのフィドルをフォークしました

Answer 2

フィドル

vertical-align:topに追加する必要がありますspoiler-inner-content-block