0

我目前正在设计这个模板 -链接- 并提出了一个恼人的问题：在过去的 3 个小时里，我一直在尝试找出一种方法，让主要内容的垂直边界线达到 100% 高度但不知何故，它只是不起作用，它一直在垂直线和页脚之间产生间隙。我正在使用foundation-zurb 4框架构建它，因此它包含多个css文件，但是我试图使其尽可能简单。如果需要，您可以在此处下载文件 -链接 2 。我希望这不是太多的要求...

提前致谢 ;）

4

2 回答 2

2

使用它来设置主容器高度等于它的父高度（行 div 高度）。
最好在页脚的某个地方使用它： 

<script type="text/javascript">
   $('document').ready(function(){
      var parentHeight = $('div.large-9').parent().height();
      $('div.large-9').height(parentHeight);
   });
</script>

更新
当我检查您的网站时，您需要在小窗口大小上删除此边框，因此将其添加到您的 css 文件中：

@media screen and (max-width: 740px){
    .container.right-border {
       border-right: none;
    }
}
于 2013-06-15T08:25:41.523 回答
0

我想你想要屏幕截图中显示的那个。实际上，<div class="large-9 columns container right-border">具有正确的边框，导致边框与内容一起结束。删除右边框并将左边框添加到以下 div<div class="large-3 columns sidebar" style="border-left: 1px solid #dedede;">的屏幕截图也附在此处。

在此处输入图像描述

于 2013-06-15T06:26:41.837 回答