0

我想用 div 模拟表的行为。

我的布局结构分为三列：

div#wrapper {
  width:800px;
  float:left;
  height:100%;
  margin-top:7px;
  text-align:center;
}
div#left {
  width:167px;
  float:left;
  padding-bottom:50px;
  margin-right:3px;
}
div#main {
  width:454px;
  float:left;
}
div#right {
  width:167px;
  float:left;
  margin-left:3px;
}

wrapper 是左、主、右三列的容器

div "main" 具有可变内容，因此在某些情况下更长，在其他情况下很短。当内容变化时，div wrapper 被适配了，没关系，但是左右列不适配 wrapper。

PS 没有 doctype 没有问题，实际上我将 left、main 和 right 的高度设置为 100%，但是当我插入 transional.dtd 时，不考虑 div 的高度。

如何解决这个问题？

对不起我的英语不好！！

4

4 回答 4

1

我同意@Neurofluxation，所以让我们看看我在 Google 上能找到什么：

使用 CSS和 CSS 仿列的100% 高度布局

于 2010-03-17T11:25:08.207 回答
0

您可以尝试插入：

min-height: 100%;

还有，为了掩饰自己:)

于 2010-03-17T10:43:55.230 回答
0

我尝试使用

min-height:100%;

但我可以解决问题。

我在不同的论坛上读到，xhtml 固定高度不可能：100% 使用 div，解决这个问题的唯一方法是使用 JQuery？

于 2010-03-17T10:54:22.003 回答
-1

你应该使用 jQuery

<script type="text/javascript">
$(this).load(function() {
   alert(document.documentElement.clientHeight + '+' + $(window).height());
   if ($(window).height() - 250 > 300)
      $('#content').css('min-height', '224px');
   别的
      $('#content').css('min-height', $(window).height() - 250);
    }
);
$(this).resize(function() {
    if ($(window).height() - 250 > 300)
       $('#content').css('min-height', '224px');
    别的
       $('#content').css('min-height', $(window).height() - 250);
    }
);
</脚本>

<div id="content" style="min-height:350px;">

</div>

只需更改高度的数字即可。

于 2010-03-17T10:59:40.717 回答