症状：
HTML文件源码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<link href="2side+main.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
#content #sideR {
background: #9966FF;
float: right;
height: 300px;
width: 120px;
}
#content #sideL {
background: #999966;
float: left;
height: 300px;
width: 120px;
}
#content #main {
background: #CC6699;
margin: 0px 120px;
height: 300px;
}
-->
</style>
</head>
<body>
<div id="content">
<div id="sideL">"sideL"</div>
<div id="main">"main"</div>
<div id="sideR">"sideR"</div>
</div>
</body>
</html>
查看设计界面出现如下状况，如下图所示：
这个并不是设计的初衷，最后的右侧区域出现了换行的情况，为了纠正这个换行的错误，
需要把其中的：
<div id="sideL">"sideL"</div>
<div id="main">"main"</div>
<div id="sideR">"sideR"</div>
代码修改为：
<div id="sideL">"sideL"</div>
<div id="sideR">"sideR"</div>
<div id="main">"main"</div>
究其原因，应该是main区域设计时并没有设计成float，所以其默认占用了整个sideL右侧的区域，不会兼顾后面还有个SideR，
为了让其显示正常，需要调整sideR和main在源码中的位置，把main放到最后。
修改后如下图：
扫一扫
5365
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
