div+css如何做页面的一行两列布局

我现在做了个页面,有三个版块,打算把其中两个版块竖直排列放在页面的左边,第三个版块紧挨着这两个版块放在右边,也就是实现一行两列的那种样式,可是我怎么做都排不成,下面是我写... 我现在做了个页面,有三个版块,打算把其中两个版块竖直排列放在页面的左边,第三个版块紧挨着这两个版块放在右边,也就是实现一行两列的那种样式,可是我怎么做都排不成,下面是我写的代码:
.center_tdbgall
{
background:#ffffff;
width:900px;
}
.middle400 {float:left; width:400px; padding:5px}
.middle250 {float:left; width:250px; padding-bottom:5px}
.middle250r {float:right; width:215; padding:5px}
#mid_1 {float:left;
height:130px;
border-style:solid;
border-width:1px;
border-color:#B7C429;
}
.650 { float:left; border-color:#CFC605; border-style:solid 1px; padding-bottom:5px; width:650px}
.650_1 {float:left; border-color:#EE8613; border-style:solid 1px; padding:5px; width:210px}
这是CSS的定义,
页面的代码是:
<div id="middle" align="center">
<div class="center_tdbgall">
<div class="main_title_575">
<div align="left"><A class=class href="#"><B>典型病例</B></A>
</div>
</div>
<div id="mid_1">
<!--{$GetPicPhoto(1007,0,True,0,6,false,false,0,3,2,130,90,20,0,True,6,0)}--></div>
<div class="middle250">
<div class="main_title_575">
<div align="left"><a class="class" href="#"><b>专家忠告</b></a></div>
</div>
<div class=main_tdbg_575>
<!--{$GetArticleList(1,33,True,0,True,5,False,False,"",0,3,1,20,0,false,0,false,False,0,False,False,False,false,True,False,1)}-->
</div>
<div class="main_title_575">
<div align="left"><a class="class" href="#"><b>骨髓炎治愈的四个阶段</b></a></div>
</div>
</div>

</div>
</div>
<div class="center_tdbgall">
<div class="650">
<div class="650_1">
<div class="main_title_575">
<div align="left"><A class=class href="#"><B>老年骨髓炎</B></A>
</div>
</div>
<div id="mid_1">
<!--{$GetPicPhoto(1007,0,True,0,6,false,false,0,3,2,130,90,20,0,True,6,0)}--></div>
</div>
</div>
</div>

肯请帮手帮我指点下,本人很急用!
按你说的方法做了,行不通.成为整个包含在center_tdbgall里的东西全居左了.应该不是改这,帮我再检查下改哪吧?我是检查不出来了,很着急.谢谢了!!
展开
 我来答
回忆526
2015-05-26 · TA获得超过4165个赞
知道大有可为答主
回答量:3276
采纳率:87%
帮助的人:1892万
展开全部
div+css做页面的一行两列布局,首先我们是需要三个div的,第一个div包裹着其他的2个div,然后给那2个div设置float属性和width,height,最好是给个border利于布局的时候方便观察,这里举个例子:

<html>
<head>
<style>
#div1{
width:960px; //通过id来控制
height:600px;
}

.left{
width:400px
height:400px;
border:1px solid #f00;
float:left;
marign-right:40px; //距离第三个div有点距离
}

.right{
width:400px;
border:1px solid #f00;
height:400px;
float:left;
}
</style>
</head>

<body>
<div id='div1'>
<div class='left'>我是左边的</div>
<div class='right'>我是右边的</div>
</div>
</body>
</html>
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
nina8286
2008-10-06 · TA获得超过107个赞
知道答主
回答量:127
采纳率:0%
帮助的人:41.7万
展开全部
.center_tdbgall
{
background:#ffffff;
width:300px;
float: left;
}
这样就行了
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
v6gogo
2008-10-06 · TA获得超过299个赞
知道小有建树答主
回答量:228
采纳率:0%
帮助的人:301万
展开全部
感觉很乱……

实现你说的效果……
如果是居中版式,首先要有个总宽度,比如width=800px;
放左边的用position:relative;float:left;要定义宽度……(1)
放右边的还是用position:relative;float:left;还是要定义宽度……(2)

注意(1)+(2)的宽度要小于总宽度,那他就会显示在同一排……

记住定宽和设float:left;是主要的……

其余的是否要
div br{display:none;}就看你自己的版式……
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式