CSS高度100%不是';t工作


CSS Height 100% isn't working

好吧,我知道这个问题已经被问了一百万次,我已经看到了一百万个关于body和html标签需要100%高度才能工作的答案,但我无法让这个东西工作。问题来了:

我需要我的身体内部和侧边栏内容向下延伸,以便在对方停止的地方与对方见面。我需要这个用于wordpress的动态页面。这是标题。

header.php

<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
<head>
<?php wp_head(); ?>
!!!!content cut to save space!!!!!
</head>
<body <?php body_class(); ?>>
<div id="site">
    <div id="wrapper">
            <!------break-from-header------>
            <div id="wrapperbody">
                <div id="bodyinside">

index.php页面和post.php页面——任何有内容的页面都在调用上面的页眉和下面的页脚。不言自明的权利?

footer.php

                </div><!--body-inside-->
<div id="sidebar">
<?php get_sidebar(); ?>
<div id="sidebarlight">
</div>
</div>
            </div><!--wrapper-body-->
        </div><!--main-wrapper-->
    <div id="footer-wrapper">
        <div id="footer">
    <div id="footer-nav">
                <?php wp_nav_menu(array('theme_location' => 'footer-menu')); ?>
            </div><!--footer-nav-->
            <div id="copyright">
                <p>Powered by: <a href="http://wordpress.org">WordPress</a> Copyright 2013</p>
            </div><!--copyright-->
        </div><!--footer-->
    </div><!--footer-wrapper-->
</div>
</body>
</html>

最后是css

/******************************Basic CSS**************************************/
html,
body {
    background-image:url('http://patriotvoice.net/wp-content/uploads/2013/11/bg.jpg');
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position:center; 
    color: #000;
    font-family: 12pt/12pt 'Source Sans Pro', sans-serif;
    height:100%
    line-height: 100%;
    margin: 0px auto;
    padding: 0px;
    }
/*********************************Wrappers********************************/
#site {
    float: left;
    width: 100%;
    height: 100%
}
#wrapper {
    height: 100%;
}
/*****************Main Body******************/
#wrapperbody {
    display: block;
    background: #ffffff;
    padding-top: 70px;
    width: 1100px;
    height: 100%;
    margin: auto;
}
#bodyinside {
    display: inline;
    background: #fff;
    width:740px;
    height: 100%;
    float:left
}
/**************Sidebar******************/
#sidebar-wrapper {
    display: inline;
    background: #2E2E2E;
    float: left;
    position: relative;
    width: 340px;
    height: 100%;
}

我去掉了很多代码,但这是最基本的东西。就像我说的那样,我需要侧边栏和正文内部相互对齐。你可以看到内容延伸到侧边栏之外的位置,我需要灰色向下延伸才能在这里与白色相遇http://patriotvoice.net.....但我需要在这样的页面上从白色延伸到灰色http://patriotvoice.net/news

我认为你应该对所有包装和内容使用min-height:100%;,因为你给了body和html标签height:100%;//对不起,我可能没有很好地理解你的问题,我正在努力学习英语,但没有取得显著结果

首先给出的网站看起来很奇怪,因为位置:固定在导航主包装器上。因此,您的内容被向上推。

为了更好地进行编码,请使用header.php、content.php(带循环)、sidebar.php、footer.php来调用索引。

根据你输入的内容,你的身高应该很好。

发布一个它看起来如何的例子,并提供更多内容,让我更好地了解高度:100%不起作用,所以我可以进一步帮助你。