index.html
<!Doctype html>
<html>
<head>
<meta charset = "utf-8" />
<title>Demo</title>
<link href = "styles.css" type = "text/css" rel = "stylesheet" />
</head>
<body>
<div id = "left_sidebar">
Left
</div>
<div id = "right_sidebar">
Right
</div>
<div id = "content">
Content
</div>
</body>
</html>
styles.css
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
}
body {
background-color: #ccc;
}
#left_sidebar, #right_sidebar {
width: 240px;
height: 100%;
background-color: #fff;
}
#left_sidebar {
float: left;
border-right: 3px solid #000;
}
#right_sidebar {
float: right;
border-left: 3px solid #000;
}
#content {
overflow: hidden;
border: 1px solid #ff0000;
min-height: 1000px;
}
Как можно без JavaScript растянуть нормально блоки?
Простой
Простой