问题是您正在使用称为绝对的定位格式。这意味着每个div都按照您定义的坐标精确定位在屏幕上,其他div(也是绝对定位的)不会影响其他任何div的位置。
如果您使用position:relative而不是position:absolute,那么它可能会让您沿着正确的方向行进。
阅读其中的一些,他们可能会有所帮助:
http://www.communitymx.com/content/article.cfm?page=2&cid=3B56F
http://css-tricks.com/absolute-relative-fixed-positioining-how-do-they-differ/
我不知道你的页面是为了看起来像,但是这个基本概念开始,建立自己的技能围绕它:)
#Header, #Content, #Footer{
position:relative;
width:100%;
}
#Header{
height:100px;
background:yellow;
}
#Content{
height:400px;
background:green;
}
#Footer{
height:100px;
background:blue;
}
和HTML将
<body>
<div id="Header">Put your header stuff here.</div>
<div id="Content">Put your content here.</div>
<div id="Footer">Put your footer stuff here.</div>
</body>
把孩子放在正确的部分,并设置他们的位置相对也。
玩这些,看看你是如何相处。花尽可能多的时间,因为你可以真正理解定位,一旦你有这个坚实的基础,你会发现设计更容易!
很抱歉,如果我不够具体,我敢肯定,在其他一些不错的家伙,所以会加重这个,给你一只手,如果他们有什么建设性的补充:)
你能后的图像你的布局希望?它很难理解你想要做什么... – gearsdigital 2011-02-03 22:14:50
我会打赌(没有详细看问题),这是一个问题,这将在很大程度上通过使用'overflow:hidden'来解决。 – 2011-02-03 22:17:22