Question

我对CSS很垃圾，我糊里糊涂，而不是把头撞在砖墙上......

www.SchofieldBell.com

我把书中的一部分放在中间，把所有内容放在#wrapper中：

#wrapper
{
    BORDER-RIGHT: 0px solid; 
    BORDER-TOP: 0px solid; 
    BORDER-LEFT: 0px solid; 
    BORDER-BOTTOM: 0px solid; 

    PADDING-TOP: 0px;   
    PADDING-RIGHT: 0px; 
    PADDING-LEFT: 0px; 
    PADDING-BOTTOM: 17px; 
    MARGIN: 0px auto; 

    WIDTH: 900px;

    DISPLAY: block;

    POSITION: relative; 
    TOP: 0px; 
}

但我希望页面的左侧（缺少的位）根据屏幕尺寸扩大或缩小......

有什么想法吗？

Answer 1

它被称为弹性或流体布局，并且有一个great article in A List Apart

Answer 2

首先关闭......

图像过载，优化或其他东西，花了5-8秒加载
为元素提供23％的宽度和最小高度属性。
这个设计根本不流畅，对于我的1600x1200屏幕来说太大了，重新考虑一下。
使用混合的CSS / tables /和iFrame非常混乱，请尝试纠正。

感谢。

Answer 3

首先，请以全小写形式编写CSS代码 - 这样更容易阅读。： - ）

#wrapper {
    width: 90%;
}

确保#wrapper的宽度始终等于视口的90％（浏览器的查看区域）。

或

#wrapper {
    margin: 20px;
}

将确保#wrapper宽度始终为视口的100％，每边减去20像素。

我是否正确理解了您的问题？

Answer 4

根据我是否正确理解您的目标，这可能值得一试：将div放在#wrapper中并将其定位为c。从包装纸的右侧900px。我假设您的意图是从页面左侧溢出文本。

Answer 5

Eduardo提到A List Apart，但是，我认为该网站上的这篇文章可能更合适（因为它似乎正是你想要的）。

2 columns, liquid, fixed right

使用css根据屏幕大小扩展或缩小

5 个答案: