+ -
当前位置:首页 → 问答吧 → CSS如何让两个DIV居左并垂直排列,右边放置另一个DIV

CSS如何让两个DIV居左并垂直排列,右边放置另一个DIV

时间:2011-04-08

来源:互联网

CSS+DIV新手,问题应该不难吧。。还有这么贴网页代码到论坛里呢

作者: finalwind   发布时间: 2011-04-08


<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>一行两列的自适应宽度</title> <style type="text/css"> div,h1,h2,p {margin:0; padding:0;} .col-main, .col-sub, .col-extra {float:left;} .col-main {width:100%;} .col-sub {margin-left:-100%; width:200px;} .col-extra {margin-left:-200px; width:200px;} .grid {overflow:hidden; zoom:1; background:#ddd;} .grid .main-wrap {margin:0 210px; background:#f5f5f5;} </style> </head> <body> <h1>一行三列的自适应宽度</h1> <div class="grid"> <div class="col-main"> <div class="main-wrap"> <h2>main</h2> <p>北京时间4月8日消息,据国外媒体报道,Google创始人拉里&#8226;佩奇出任CEO后开始对管理层进行重组。Google今天宣布六项新的高管任命,晋升六名业务主管为高级副总裁。这些高管均由佩奇提名,将负责佩奇划分的新业务单元。</p> <p>这六名新高管晋升分别是:Sundar Pichai出任Chrome业务高级副总裁、任命Vic Gundotra为社交业务高级副总裁、Andy Rubin出任移动业务高级副总裁、Salar Kamangar为YouTube和视频业务高级副总裁、Alan Eustace为搜索业务高级副总裁、Susan Wojcicki为广告业务高级副总裁。</p> </div> </div> <div class="col-sub"> <h2>sub</h2> <p>Susan Wojcicki为广告业务高级副总裁</p> </div> <div class="col-extra"> <h2>extra</h2> <p>Kamangar为YouTube和视频业务高级副总裁</p> </div> </div> </body> </html>
 提示:您可以先修改部分代码再运行
[ 本帖最后由 caoqing 于 2011-4-8 15:48 编辑 ]

作者: caoqing   发布时间: 2011-04-08

已经自行解决了,不过谢谢LS的回答

作者: finalwind   发布时间: 2011-04-08