题解 | #三列布局 - 圣杯布局#
三列布局 - 圣杯布局
https://www.nowcoder.com/practice/309102a6fe984fab8612ede4173abd54
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
.container {
border: 1px solid black;
overflow: hidden;
padding:0px 100px;
min-width:100px;
}
.left {
background-color: greenyellow;
float:left;
width:100px;
margin-left:-100%;
position:relative;
left:-100px;
}
.center {
background-color: darkorange;
float:left;
width:100%;
}
.right {
background-color: darkgreen;
float:left;
width:100px;
margin-left:-100px;
position:relative;
left:100px;
}
</style>
</head>
<body>
<section class="container">
<article class="center"><br /><br /><br /></article>
<article class="left"><br /><br /><br /></article>
<article class="right"><br /><br /><br /></article>
</section>
</body>
</html>
