H14 C14

授業　演習問題 

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>H14</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="container">
<header>header</header>

<div id="wrapper">
<section id="left">section01</section>
<section id="right">section02</section>
<article>article</article>
</div>

<footer>footer</footer>
</div>
</body>
</html>

@charset "utf-8";
body{
  margin: 0;
  padding: 0;
}
#container{
  width: 90%;
  min-width: 650px;
  margin: 0 auto;
}
header{
  height: 80px;
  background: #d3d3d3;
  margin-bottom: 10px;
}
article{
  background: #98fb98;
  height: 400px;
  margin-left: 190px;
  margin-right: 190px;
}
footer{
  width: auto;
  height: 80px;
  background: #d3d3d3;
  clear: both;
}
#wrapper{
  width: 100%;
  height: 400px;
  margin-bottom: 10px;
  background: #87cefa;
  overflow: hidden;
}

#left{
  width: 180px;
  height: 400px;
  float: left;
  background: #ffc0cb;
}
#right{
  float: right;
  width: 180px;
  height: 400px;
  background: #d8bfd8;
}