0

CSS の vertical-align プロパティを説明しているこのページしか見つかりませんでしたが、このフィドルに従っては機能しません。

http://jsfiddle.net/C8ejb/

CSS の重要な部分: (質問を投稿するために必要です)

header
{
    display:inline-block;
    height:20%;
    width:100%;
    background:rgba(0,0,0,0.9);
    color:#ccc;
}
    header .header_content
    {       
        display:inline-block;
        background:rgba(255,255,255,0.4);
        vertical-align:middle;  
    }

では、vertical-align プロパティを実際に使用できる条件のリストを作成して、「vertical-align ルールが機能しない理由」を大幅に節約できるでしょうか? 質問だと思います。

助けてくれてありがとう！

4

2 に答える 2

0

デモはこちら

CSS:

header {
    display: table;   /* Change this */

    height:20%;
    width:100%;
    background:rgba(0,0,0,0.9);
    color:#ccc;      
}

.header_content {       
    display:inline-block;
    background:rgba(255,255,255,0.4);

    display: table-cell;   /* Change this */

    vertical-align: middle;
}

詳細については、こちらをご覧ください。

于 2013-09-05T00:29:12.790 に答える
0

垂直方向の配置は、相互に関連する複数のインライン ブロック要素にのみ影響します。高さが異なる2 つの.header_content要素がある場合は、それらが中央に垂直に配置されていることがわかります。

http://jsfiddle.net/C8ejb/5/

于 2013-09-05T00:29:25.413 に答える