【floatの練習】
【floatの練習】
<html>
<head>
<title>floatの練習</title>
<style type="text/css">
#container{
width:700px;
height:auto;
background-color:black;
}
#wrapper{
width:700px;
height:500px;
background-color:red;
}
#content{
width:395px;
height:500px;
background-color:green;
float:left;
margin-right:5px;
}
#sidebar{
width:295px;
height:500px;
background-color:yellow;
float:right;
margin-left:5px;
}
#header{
width:700px;
height:100px;
background-color:red;
margin-bottom:10px;
}
#footer{
width:700px;
height:100px;
background-color:red;
margin-top:10px;
}
</style>
</head>
<body>
<div id="container">
<div id="header">header</div>
<div id="wrapper">
<div id="content">content</div>
<div id="sidebar">sidebar</div>
</div>
<div id="footer">footer</div>
</div>
</body>
</html>
