使用 PHP ob_start() 缓冲输出时，最小高度 CSS 属性不起作用答案

【问题标题】：min-height CSS property doesn't work while buffering output with PHP ob_start()使用 PHP ob_start() 缓冲输出时，最小高度 CSS 属性不起作用
【发布时间】：2013-01-23 14:15:25
【问题描述】：

我实际上正在使用 MVC 结构开发一个 PHP 项目，包括在使用 ob°start() 进行输出缓冲期间通过单个文件的 DOCTYPE 和 HEAD 标记。

当我想为可能的页面容器声明一个 min-height 属性时，问题就来了，以便将页脚粘贴在页面的底部。 ob_start() -- ob_get_clean() 的使用似乎禁止浏览器及时访问这些属性，因此它们无法评估高度值。

这是我的 index.php 文件：

<?php
include_once('global/init.php');
ob_start();
if(isset($_GET['module'])){
    $module = dirname(__FILE__).'/modules/'.htmlspecialchars($_GET['module']).'/';
    $action = (isset($_GET['action'])) ? htmlspecialchars($_GET['action']).'.php' : 'index.php';
    if(!file_exists($module.$action)){
        include('global/home.php');
    }else{
        include($module.$action);
    }
}else{
    include('global/home.php');
}
$content = ob_get_clean();
include_once('global/header.php');
echo $content;
include_once('global/footer.php');

header.php 文件包含 doctype，以及 html 的第一个基础知识：

<html>
<head>
    <meta charset='UTF-8' />
    <title><?php echo "LiveSession".' '.DOMAIN_INFOS;?></title>
    <meta name='description' content='<?php echo $_SESSION['currentDesc'];?>' />
    <meta name='keywords' content='<?php echo $_SESSION['currentKWds'];?>' />
    <link rel='stylesheet' media='screen and (max-width:480px)' href='css/smartphones.css' />
    <!-- TABLETS -->
    <script type='text/javascript' src='scripts/jquery.1.7.js'></script>
    <script type='text/javascript' src='scripts/poll_edit.js'></script>
    <script type='text/javascript' src='scripts/smartphones.js'></script>
</head>
<body>
    <div id='page'>
        <div id='header'>
            <h1><a href='index.php'>InteractivePollSession</a></h1>
            <?php
                if(is_connected_user()){
                    echo "<span id='disconnector'><a href='index.php?module=members&amp;action=dscnx' title='disconnect'>Disconnect</a></span>";
                }
            ?>
        </div>
        <div id='contentWrap'>

页脚：

            </div>
        <div id='footer'>
            <span id='central-footer'>&copy; <a href='http://www.jsteitgen.com'>JSTeitgen</a></span>
        </div>
    </div>
</body>

还有一个基本的 css 示例：

body{height:100%;}
#page{min-height:100%; position:relative;}
#footer{position:absolute; bottom:0; width:100%;}

有谁知道如何使用 ob_start() 来解决这个问题？当然，除此之外，其他所有 CSS 规则都可以正常工作...

谢谢

【问题讨论】：

服务器端代码似乎不太可能影响发送的 html/css 的呈现。如果你去掉输出缓冲，你能确认它有效吗？

标签： php css ob-start

【解决方案1】：

ob_start() 不是问题所在。问题只是一个 html/css 问题。如果元素的父级具有固定高度，则只能使用百分比高度。

在您的情况下，#page 父级是 body，body 的高度是 100%，因此您不能为 #page 使用百分比高度。但是你可以试试这个，例如：

body{height: 1000px;}
#page{min-height:100%; position:relative;}
#footer{position:absolute; bottom:0; width:100%;}

【讨论】：

【解决方案2】：

我认为问题出在 css 上；您将 body 元素的高度设置为其父元素 html 元素的 100%，该元素的高度不一定是 100%。

您应该能够使用以下方法解决您的问题：

html, body {
  height: 100%;
}

【讨论】：

@user1758625 不客气。如果它对您有用，请不要忘记接受答案（计票下方的复选标记）。