我需要三个表 (div)。 左右两边分别占据了50%的自由窗口。 中心是固定的。
一切似乎都很好，但马上就要跳下 table 了。
<!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" lang="en" xml:lang="en">
<head>
<style type="text/css">
body{
margin:0;
padding:0;
}
#left{
float: left;
width: 50%;
background: #FDA02E;
margin-left: -300px;
}
#center{
float: left;
width: 600px;
margin-right: 300px;
background: #C8FF98;
}
#right{
float: left;
width: 50%;
margin-left: -300px;
background: #FDE95E;
}
</style>
</head>
<body>
<div id="pag">
<div id="left">
Left
</div>
<div id="center">
Center
</div>
<div id="right">
Right
</div>
</div>
</body>
</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" lang="en" xml:lang="en">
<head>
<style type="text/css">
body{
margin:0;
padding:0;
}
#left{
float: left;
width: 50%;
background: #FDA02E;
}
#center{
position: absolute;
width: 600px;
left: 50%;
margin-left: -300px;
background: #C8FF98;
}
#right{
float: right;
width: 50%;
margin-left: -300px;
background: #FDE95E;
}
</style>
</head>
<body>
<div id="pag">
<div id="left">
Left
</div>
<div id="center">
Center
</div>
<div id="right">
Right
</div>
</div>
</body>
</html>
关于css，固定大小，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2608118/