はてなブログで横並びにした画像の縦位置を上揃えにする。（カスタマイズCSS）

はてなブログで、画像を横並びにした場合、縦位置が中央揃えになってしまう。

これを、上揃えにする方法。

【個別にする方法】

「HTML編集」で、「div class="images-row"」に、

style="display:flex; justify-content:center; align-items:start;"

のスタイルを追加。

<div class="images-row mceNonEditable" style="display:flex; justify-content:center; align-items:start;">
<div class="images-row-item"><img src="....." /></div>
<div class="images-row-item"><img src="....." /></div>
</div>

【ブログすべての横並び画像に適用する方法】

• 〔デザイン〕→〔カスタマイズ〕→〔デザインCSS〕

のところに、以下のCSSを追加。

.images-row {
	display: flex;
	justify-content: center;
	align-items: start;
}

以下、CSS適用前後のサンプル。

標準のまま：上下中央揃え

カスタマイズCSS適用：上揃え