DivヘッダーがWebページに配置されていません

Question

2つの行のコンテンツがあるビルドしているWebサイトにホームページがあります。各行には2つの段落が含まれています。それぞれに見出しと関連するボタンがあります。例：

        This is the second paragraph 
This is the first paragraph   and it does not line up 
"content...................   "content.................... 
..........................   ............................. 
.........................."   ............................." 
            |BUTTON| 

問題は、各divのヘッダーを互いに整列させたいということです。各ヘッダーの最初の行が整列する必要があります。 divのコードは次のとおりです。

/* Home page introductory paragraphs layout */ 
div { 
    display: inline-block; 
    height: 200px; 
    width: 500px; 
    padding-left: 75px; 
    padding-right: 75px; 
    padding-top: 40px; 
    padding-bottom: 40px; 
} 

ヘッダーが常にブロックの先頭にあるように指定する方法はありますか？

Answer 1

デフォルトのvertical-alignの値はbaselineです。要素を一番上に配置する必要がある場合は、topに設定できます。

div { 
    display: inline-block; 
    vertical-align: top; /*NEW*/ 
} 

Answer 2

2つのdivを上に並べるようにしたい場合。固定位置タグを使用するのはどうですか？

position:fixed: 
top:40px; 

もう一度試してください。

.a { 
    display: inline-block; 
    height: 200px; 
    width: 500px; 
    padding-left: 75px; 
    padding-right: 75px; 
    padding-bottom: 40px; 
    position:fixed: 
    top:40px; 
}