復習⑤

授業　復習 

<!DOCTYPE html>
<html lang="ja">
<head>
<title></title>
<meta charset="utf-8">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="container">
<div id="header">block A</div><!-- /header -->
<div id="wrapper">
<div id="content">block B</div>
<div id="sidebar">block C</div>
</div><!-- /wrapper -->
<div id="footer">block D</div>
</div><!-- /container -->
</body>
</html>

@charset"UTF-8";
/* リセット */
body,div{
  margin: 0;
  padding: 0;
}

/* 全体 */ 
body {
  background-color: #fff;
  font-size: 20px;
  font-family:
    "Hiragino Kaku Gothic ProN",
    Meiryo, 
    sans-serif;
}
#container{
  width: 600px;
  padding: 10px;
}
#header{
  height: 50px;
  margin-bottom: 10px;
  background-color: orange;
}
#wrapper{
  width: 600px;
  margin-bottom: 10px;
  overflow: hidden;
}
#content{
  float: right;
  width: 295px;
  height: 50px;
  background-color: coral;
}
#sidebar{
  float: left;
  width: 295px;
  height: 50px;
  background-color: limegreen;
}
#footer{
  height: 50px;
  background: lawngreen;
}