<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>3. Two-column layout with fixed right and left adaptive</title>
<style type="text/css">
.main {
height:600px;
background-color:skyblue;
margin-right:200px;
}
.right {
width:200px;
height:600px;
background-color:lightgreen;
float:right; /*Set the right float of the block element* /
}
</style>
</head>
<body>
<div> Body</div>
<div>right</div>
</body>
</html>
Agree with the second floor’s point of view
You use margin-right:200px;
Do you want to leave space for the div on the right?
But the default width of div is 100%
So after you set margin-right:200px; the div width is actually still 100%
Because padding, margin, width, border are added It is the real width or height of the component
lilove2018-03-26 14:57:21
Please change
<div>body</div>
<div>right side</div>
to
<div class="main">Main</div>
<div class="right">Right</div>
Test the code again ~