Q&A
HTML
1<!DOCTYPE html> 2<html> 3 <head> 4 <meta charset="UTF-8"> 5 <link rel="stylesheet" type="text/css" href="index.css"> 6 </head> 7 <title> 8 9 </title> 10 <body> 11 12 <p class="pic"></p> 13 </body> 14</html>
CSS
1*{ 2 margin:0; 3 padding:0; 4 } 5html{ 6 height:100%; 7 width: 100%; 8} 9body { 10 height: 100%; 11} 12.pic{ 13 width: 20%; 14 height: 5%; 15 background-repeat: no-repeat; 16 background-color: aquamarine; 17}
上の状態では正常にp要素に設定した背景色が表示されています。
しかし、これをdivで囲うと、
HTML
1<div> 2 <p class="pic"></p> 3</div>
画面から消えてしまいました。
div要素は囲んだだけではレイアウトやコンテンツに影響を与えない要素、
だそうですが何故消えたのでしょうか？
回答1件
0
ベストアンサー
div要素のheightとwidthが決まってないから、子要素のwitdhとheghtのパーセントが0になってるんじゃないでしょうか。
div要素にもwidthとheghtの大きさ何pxかつけるか、100%にしてみてわどうでしょうか。
投稿2021/12/28 10:25
総合スコア280
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2021/12/28 12:19