当前位置：首页 → 问答吧 → 求三个div 同一行显示的css

求三个div 同一行显示的css

时间：2011-11-30

来源：互联网

求三个div 同一行显示的css设置。
左div 固定大小120px，接着是10px 剩下的全部给右边的div 。

HTML code


  <div id="main" style="width:100%;">
     <div id="left" style="width:120px;"></div>
     <div id="division" style="width:10px;"></div>
     <div id="right" style="100%"></div>
  </div>

作者: hua_chong_wei 发布时间: 2011-11-30

HTML code

<!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" />
    <style type="text/css">
        body{margin:0px;}
        div
        {
            border: 1px solid #000000;
            width: 100px;
            height: 200px;
        }
        #zuobian
        {
            float: left;
            
        }
        #youbian
        {
            float: right;
            margin:0px;
            
        }
        #zhongjian
        {
            margin:0px auto;
        }
    </style>
    <title>无标题文档</title>
</head>
<body>

    <div id="zuobian">
        左边的
    </div>
    
    <div id="youbian">
        右边的
    </div>
    <div id="zhongjian">
        中间
    </div>
</body>
</html>

需要改下。。

作者: zsx841021 发布时间: 2011-11-30

有几点是不能改的，就是右边的左边的大小是120px，然后是10px ，剩下的根据浏览器的剩余大小都给右边的。这个css 要怎么写

引用 1 楼 zsx841021 的回复:

HTML code
<!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-……

作者: hua_chong_wei 发布时间: 2011-11-30

哦。我说错了，左边的是120px ，然后是120px ，右边的是根据浏览器来确定

引用 2 楼 hua_chong_wei 的回复:

有几点是不能改的，就是右边的左边的大小是120px，然后是10px ，剩下的根据浏览器的剩余大小都给右边的。这个css 要怎么写
引用 1 楼 zsx841021 的回复:

HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/……

作者: hua_chong_wei 发布时间: 2011-11-30

用表格比较容易

作者: lingling6519 发布时间: 2011-11-30

<!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=utf-8" />
<title>测试</title>
<style>
body{ width:100%;}
.left{ float:left; width:120px; background:red;}
.middle{ float:left; width:120px; background:green;}
.right{ background:#FF0};
</style>
</head>

<body>
<div class="left">左边</div>
<div class="middle">中间</div>
<div class="right">右边</div>
</body>
</html>
三个层分别加了颜色，方便测试，楼主看下吧，不知道是不是你想要的

作者: lingling6519 发布时间: 2011-11-30

求三个div 同一行显示的css

热门阅读

热门下载