我创建了一个'noob'页面,我希望使用CSS对其进行样式化,并且在某种程度上我做了一些事情。
我希望我的内容显示在中心,而(白色背景)和两个侧边栏(左右)color:blue
;
对于此页面:http://blogsoc.org/mail 我在这里编辑代码:blogsoc.org/mail1
喜欢这个(截图):https://dl.dropbox.com/u/46445635/stack%20question%20copy.png
答案 0 :(得分:2)
将所有内容放入#container
区块。
body { background-color: blue; }
#container { margin: 0 auto; width: 989px; background: white; }
margin: 0 auto
使您的块垂直居中。
width: 989px
是1024x768屏幕的安全区域。
示例HTML:
<html>
<head>
<style>
body { background-color: blue; }
#container { margin: 0 auto; width: 989px; background: white; }
</style>
</head>
<body>
<div id="container">
<!-- All your current content -->
</div>
</body>
</html>
答案 1 :(得分:1)
看看这个http://jsfiddle.net/R8S6h/2/show/
(删除show/
以查看代码)
答案 2 :(得分:0)
您可以尝试(http://jsfiddle.net/wh8RS/和http://jsfiddle.net/wh8RS/show/):
CSS:
html,body{
overflow:auto;
}
body{
margin:0;
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
}
.clear{clear:both;}
#wrapper{
overflow:hidden;
min-height:100%;
}
#sidebarleft,#sidebarright{
background-color:blue;
width:250px;
max-width:25%;
margin-bottom: -10000px;
padding-bottom: 10000px;
min-height:100%;
}
#sidebarleft{
float:left;
}
#sidebarright{
float:right;
}
#main{overflow:hidden}
HTML:
<body>
<div id="wrapper">
<div id="sidebarleft">Text 1</div>
<div id="sidebarright">Text 2</div>
<div id="main">Text 3</div>
<div class="clear"></div>
</div>
</body>