zoukankan html css js c++ java

[css layout][07] three fixed columns

 1 #container {
 2   width: 900px;
 3   margin: 0 auto;
 4 }
 5 #wrapper {
 6   float: left;
 7 }
 8 #content {
 9   margin: 0 200px;
10 }
11 #navigation {
12   width: 200px;
13   float: left;
14   margin-left: -100%;
15 }
16 #extra {
17   width: 200px;
18   float: left;
19   margin-left: -200px;
20 }
21 #footer {
22   clear: both;
23 }

 1 #container {
 2   width: 900px;
 3   margin: 0 auto;
 4 }
 5 #wrapper {
 6   float: right;
 7 }
 8 #content {
 9   margin: 0 200px;
10 }
11 #navigation {
12   width: 200px;
13   float: right;
14   margin-right: -200px;
15 }
16 #extra {
17   width: 200px;
18   float: right;
19   margin-right: -100%;
20 }
21 #footer {
22   clear: both;
23 }

 1 #container {
 2   width: 900px;
 3   margin: 0 auto;
 4 }
 5 #wrapper {
 6   float: right;
 7   width: 500px;
 8   margin-left: -200px;
 9   position: relative;
10   left: -200px;
11 }
12 #navigation {
13   width: 200px;
14   float: right;
15   margin-left: -400px;
16   position: relative;
17   left: -400px;
18 }
19 #extra {
20   width: 200px;
21   float: right;
22   margin-right: -300px;
23 }
24 #footer {
25   clear: both;
26 }

 1 #container {
 2   width: 900px;
 3   margin: 0 auto;
 4 }
 5 #wrapper {
 6   float: left;
 7   width: 500px;
 8   margin-right: -200px;
 9   position: relative;
10   left: 200px;
11 }
12 #navigation {
13   width: 200px;
14   float: left;
15   margin-left: -300px;
16 }
17 #extra {
18   width: 200px;
19   float: left;
20   margin-right: -400px;
21   position: relative;
22   left: 400px;
23 }
24 #footer {
25   clear: both;
26 }

查看全文

相关阅读:
LeetCode 029 Divide Two Integers
LeetCode 028 Implement strStr()
Linux网络技术管理及进程管理
 RAID磁盘阵列及CentOS7系统启动流程
 Linux磁盘管理及LVM讲解（1）
逻辑卷管理
 Linux磁盘管理及LVM讲解
 Linux计划任务及压缩归档
 Linux权限管理
 用户及用户组管理

原文地址：https://www.cnblogs.com/qiudeqing/p/3418466.html