我如何获得像Google zeitgeist 2011这样的流畅的身体内容？

Question

我的网站：http://designobvio.us/portfolio/index.html

有抱负的网站布局：http://www.googlezeitgeist.com/en/top-searches/rebecca_black

我刚刚完成了我的导航栏，它是固定的。现在是时候转到中心内容了。不幸的是，我对如何标记这一点感到困惑。

问题1:所有的东西似乎都是100%的高度(我从来没有达到过工作的高度>_<;;)

问题2:我使用的是grid960，图像会漂浮在960网格之上。

问题3:当你缩小窗口时，图像会缩小。

问题4:当缩小窗口文本面板时，会覆盖图像。

我做了一个PDF的布局。下面是使用网格覆盖的示例：http://www.designobvio.us/portfolio/homepage%20copy.pdf

有没有人可以用jsfiddle演示这个布局，或者至少引导我自己回答这个问题？我真的被难住了。

谢谢

Answer 1

• 100% height表示元素将使用父元素的高度。如果你想要一个div，比如#wrapper，是窗口高度的100%，那么它的父级也必须设置为100%高度，依此类推。所以基本上:例如：http://jsfiddle.net/Vy6hP/
• Why html, body, #wrapper {height: 100%;} floating是个问题吗？如果你想做一个动态布局，你不应该使用960系统，而应该使用一个灵活的系统(即。一个基于%而不是px)
• 给图像一个max-width: 100%;，它应该可以正常工作(示例：http://jsfiddle.net/Vy6hP/1/ )
• 我不理解你的最后一个问题