【问题标题】:How to make sidebar's height equal to the content height (two columns table with divs)?如何使侧边栏的高度等于内容高度(带有 div 的两列表格)?
【发布时间】:2011-10-03 02:07:41
【问题描述】:

我创建了 2 列布局 - 内容 div 和侧边栏 div,带有页眉和页脚。查看实时示例here。 我怎样才能使侧边栏的高度等于内容高度(即我应该有等于两列表格的东西)。

我使用 jquery 和 jquery ui。

【问题讨论】:

  • 只有css才能解决,只有html5标准。在 html4 中,您只能使用以下技巧:背景图片中的假列,或使用 javaScript!
  • 您需要支持哪些浏览器/版本?具体来说:需要支持IE7吗?
  • @thirtydot,当然应该也支持IE7。
  • 那么使用table而不是divs不是更好吗?
  • CSS 2.1 中最令人沮丧的遗漏之一是创建等高列的能力。正如 Alexander 指出的那样,除非您想使用 JavaScript,否则不容易做到。您只需要搜索“等高 CSS 列”并选择适合您的技术。桌子?是的,那会奏效。只要你不介意成为蔑视和嘲笑的对象。 ;-)

标签: css layout html


【解决方案1】:

我以前使用过这种技术来解决这个确切的问题,并且效果很好:

http://www.filamentgroup.com/lab/setting_equal_heights_with_jquery/

【讨论】:

  • PS:我应该补充一点,正常的做法是使用 CSS “伪造”它,但我猜你实际上希望
    元素实际上具有相同的高度,如反对只是看起来像他们做的那样。
  • 谢谢。但是我相信对于我的情况应该有更简单的解决方案;)。
【解决方案2】:

如果您需要 CSS 解决方案,请查看 Faux Columns。您实际上使用重复的背景图像来伪造列。链接的文章只是一个例子,你可以在上面搜索 100 篇文章。

【讨论】:

    猜你喜欢
    相关资源
    最近更新 更多
    热门标签