クラス名sidebar-rightのdivタグを追加して、クラス名contentsのdivをsidebar-left・sidebar-rightで左右から挟むように表示したいのですが、htmlのどの部分に追加すればよいのかがわかりません。
一度、contentsの</div>前に追加したのですが、sidebar-rightがcontentsの下に回りこんで表示されました。
「CSS」
.sidebar-left {
height: 500px;
width: 200px;
float: left;
padding: 30px;
background-color: blue;
}
.contents {
height: 500px;
background-color: #E8E5FF;
width: 900px;
float: left;
padding: 30px;
}
.sidebar-right {
height: 500px;
width: 200px;
float: right;
padding: 30px;
background-color: blue;
}
「HTML」
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="stylesheet.css"> </head> <body> <div class="header"> <div class="header-left"></div> <div class="header-right"> <ul> <li>トップメニュー</li> <li>戻る</li> </ul> </div> </div> <div class="main"><div class="contents"> <div class="contents-top"> <h1></h1> <div class="contents-top-item"> <h2></h2> <p></p> </div> <div class="contents-top-item"> <h2></h2> <p></p> </div> <div class="contents-top-item"> <h2></h2> <p></p> </div> </div> <div class="contents-bottom"> <h1></h1> </div> </div> </div> <div class="footer"></div> </body> </html><div class="sidebar-left"> </div>
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。