.hero img に position: absolute; があると .hero に設定した height: 400px; が反映されません

.hero img は絶対配置されているので、親要素の影響を受けない、と考えるといいでしょう。
2022年8月12日
ユーザー
.hero {
  height: 400px;
}

.hero img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  position: absolute;
  opacity: 0;
  transition: opacity 1s;
}

.hero imgheight: 400px; の所なのですが、 position が入ると heigth:100%; では上の
親要素の

.hero {
  height: 400px; 
}

の高さ 400px は継承されないのでしょうか?

この回答を見るにはプレミアムプランへの登録が必要です

プレミアムプランとは?

このレッスンの質問と回答(3)