当前位置：首页 → 问答吧 → 请教大家一个关于定位的问题。（定位能产生滚动条吗？）

请教大家一个关于定位的问题。（定位能产生滚动条吗？）

时间：2011-02-10

来源：互联网

首先，在这里祝大家新年快乐哈。

问题：
1、我想实现的效果是让B区域【宽920px】，始终在页面居中显示，不管分辨率多大小
2、让A区域【宽250px】始终在B区域的左侧显示
3、当A+B大于显示器的分辨率时，能自动产生滚动条

我的做法：
但是，像我这样做A+B大于显示器的分辨率时，B区域会隐藏。

<!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 type="text/css"> html,body,div {padding:0;margin:0;} body {text-align:center;} .main,.aside{height:200px;} .main{width:920px;margin:0 auto;text-align:left;position:relative;background:#ccc;} .aside{width:250px;position: absolute;left: -250px;top:0px;background:#ddd;} </style> </head> <body> <div class="main"> <div class="aside">A区域</div> <div>B区域</div> </div> </body> </html>
提示：您可以先修改部分代码再运行

作者: iJieZhang 发布时间: 2011-02-10

<!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 type="text/css"> html,body,div {padding:0;margin:0;} body {text-align:center;} .main,.aside{height:200px;} .wrap{width:1170px;margin:0 auto;overflow:hidden;_zoom:1} .main{width:1170px;text-align:left;background:#ccc;} .aside{width:250px;float:left;background:#ddd;} </style> </head> <body> <div class="wrap"> <div class="main"> <div class="aside">A区域</div> <div>B区域</div> </div> </div> </body> </html>
提示：您可以先修改部分代码再运行

[ 本帖最后由 radom 于 2011-2-10 21:18 编辑 ]

作者: radom 发布时间: 2011-02-10

请教大家一个关于定位的问题。（定位能产生滚动条吗？）

热门阅读

热门下载