在我的网站上我有一个中心和一个右栏。中心列和右列由id=wrap的<div>元素包围。使用以下CSS技术将周围的div元素居中：
#wrap{
position:absolute;
left:50%;
margin-left:-307px; /* 307px = half of 594px(width of #center_column) */
}
这很好，只是当浏览器的大小调整为小于周围
<div>元素的宽度时，页面的左侧部分将被切断，无法通过水平滚动查看 最佳答案
如果你有一个amin-width的中心柱（594px）+2 x的右柱宽度，你可以试着给身体或整体包装
麻烦在于绝对布局，页面实际上并不知道div存在，它们就像粘贴在屏幕上的POST笔记，所以你必须给它一些“现实”来滚动。
[更新]
我不太清楚你是怎么定位的，但你根本不需要[绝对]定位中心柱，然后你就可以使用居中的方法。。然后将右栏放在底部的居中栏内，并将右栏放在右侧。。然后屏幕保持布局居中，如果右侧边栏被覆盖，则滚动
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
"http://www.w3.org/TR/REC-html40/strict.dtd">
<html>
<head>
<title> Centered with right Sidebar </title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" href="/" type="text/css" media="screen" charset="utf-8">
<style type="text/css" media="screen">
#wrap{
width: 594px; /* width of center column only */
margin: 0 auto;
position: relative;
border: 3px solid #eee;
height: 400px /* demo only add content for real height */
}
#rightcol {
position: absolute;
right: -260px; /* adjust to suit allowing for borders */
bottom: 0;
border: 3px solid #ff0;
width: 250px;
height: 300px /* demo only */
}
</style>
</head>
<body>
<div id="wrap">
<div id="content">
<h1>HTML Ipsum Presents</h1>
<p><strong>Pellentesque habitant morbi tristique</strong> senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est.</em> Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, <code>commodo vitae</code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. <a href="#">Donec non enim</a> in turpis pulvinar facilisis. Ut felis.</p>
<div id="rightcol">Right sidebar</div>
</div>
</div>
</body>
</html>