液柱与之搭配的高度和背景图片

我正在为我的网站一个新的布局,使用页眉,页脚和两列的中心区域。 两列由主内容区域是流体的高度和宽度和右边栏是流体的高度和宽度固定。 我已经做了类似的布局之前,但是这一次取决于使用两个不同的背景图像(一个用于边栏,一个用于内容区域)。

有什么办法来实现这一点,使用正确的HTML和CSS,使两列的背景图像总是相同的高度,无论是哪个栏目的内容越长?

我已经使用JavaScript来模拟这种尝试,但它不工作这么好,如果有内容区域的图像。 我真的不喜欢使用这种方法的任何方式。

任何帮助是极大的赞赏。

我有设置一个临时环境,在http://staging.jamesarmes.net/jimmyssandbox提供的一个例子。 这个环境是不是我的成品,但我希望得到控制容器之前,我谨任何进一步。 我已经发布了我的设计的样稿在

--------------解决方案-------------

假设一个HTML的结构是这样的

#container
|-- #main-content
|-- #sidebar

要使用人造列,运用重复背景#container 只要每个都是垂直重复的背景下,没有像每一个需要重复的不可调和的高度问题,你可以用它直接关闭。

但是,既然你说的主要内容区域是流动的,这会产生一些问题。 “创建液态人造列”可能为你工作。

另外,我会考虑使用普通的人造列和牺牲一个非语义div ,你做伸展到全高#container相互矛盾的绝对位置。 常规人造列将被定位成覆盖固定宽度柱并且,是很宽的 ,将提供背景到流体柱,直到绝对定位div含有重复的背景的相对端,在踢。结构只是

#container
|-- #bghack
|-- #main-content
|-- #sidebar

#bghack暂时落后的兄弟姐妹。

分类:HTML 时间:2013-02-19 人气:0
本文关键词: HTML,CSS,布局
分享到:

相关文章

Copyright (C) 55228885.com, All Rights Reserved.

55228885 版权所有 京ICP备15002868号

processed in 0.169 (s). 9 q(s)