inline-blockを使うことでなぜ幅と高さが設定されるようになるのでしょうか?

2017年10月25日
ユーザー

動画内で「幅と高さはそこに含まれる画像のものにしたいので、display: inline-block;」と説明されていますが、inline-blockがあることでなぜ幅と高さが設定されるのかがよくわかりません。inline-blockは、blockを横に並べるように設置するためのものではないのでしょうか?

product要素のスタイリングは、動画でも紹介されているように以下のようなコードです。

main .product{
    position: relative;
    display: inline-block;
}

試しにdisplay:inline-block;の設定を消してみたところ、ブラウザ上では次のようになりました。

2438.png

この回答を見るにはプレミアムサービスへの登録が必要です

プレミアムサービスとは?