如何划分包含在PHP中的页脚和标题？

Question

I'm using a footer included in a php document, but it is going over the php page content.

Here is an example: http://screencast.com/t/L69p1gm2

And this is the code which I'm using:

<?php include 'header.php' ?>
<div class="kalendar">
  <iframe class="kalendarframe" src="link to the calendar"&amp;color=%23711616&amp;ctz=Europe%2FBelgrade" style=" border:solid 1px #777 " width="100%" frameborder="0" scrolling="no"></iframe>
</div>
<?php include 'footer.php' ?>

I've tried to do something with css but without any positive results..

What could be a problem here?

Why is the footer going over the page?

Thanks

Here is the footer.php (which is empty):

<div id="footer">
</div>
</body>
</html>

And here is my css:

html, body{
            background-color: #fff;
            background-repeat:no-repeat;
            background-attachment:fixed;
            background-size:cover;
            width:100%;
            margin:0px 0px 0px 0px;
            padding:0px;
            position:absolute;
        }


        /* KOMPLETAN HEADER SA MENIJIMA */

        header{
            padding-top:0px;
            text-align:;
            height:40px;
            margin-top:0px;
            margin-left:-10px;
            width:101%;
            position:absolute;
            top:0;
            left:0;
            background-color:#424242;
            opacity:0.9;
            position:fixed;
            font-family: tahoma;
        }


        header .logout a{
            margin-top: 0px;
            padding-right:150px;
            color:white;
            text-transform:uppercase;
            font-size: 14px;
            float:right;
            text-decoration:none;
            font-family: 'Raleway', sans-serif;
        }

        /*  --------------------------  MENI -----------------------*/

        #menu{
            width:960px;
            color:#fff;
            font-size:12px;
            text-transform:uppercase;
            margin: 0 auto;

        }

        #menu ul li {
            display: inline; 
        }

        #menu li a{
            font-family: 'Raleway', sans-serif;
            margin-right: 15px;
            color:#fff;
            text-transform:uppercase;
            font-size: 14px;
            text-decoration:none;

        }

        #menu li a:hover{
            color: red;
            text-decoration:none;
            text-align: center;

        }

        /* -----------------------------------------------------------*/

        /* WRAPPER  SADRZAJ STRANICE */

        #wrapper{
            width:960px;
            margin:0 auto;

        }


        #heading{
            text-align:center;
        }

        #lijevi{
            width: 635px;
            float:left;


        }

        #desni{
            width:310px;
            float:right;
        }

        #mediaContacts{
            float:left;
        }

        #smmSchedule{
            float:right;
        }

        #calls{
            float:left;
        }

        /*iframe{
            border-radius: 15px;
            aborder: 1px solid black;
            -webkit-box-shadow: 2px 7px 81px -5px rgba(0,0,0,0.75);
            -moz-box-shadow: 2px 7px 81px -5px rgba(0,0,0,0.75);
            box-shadow: 2px 7px 81px -5px rgba(0,0,0,0.75);
        }*/

        #table_button{
            /*width:150px;
            height:40px;
            margin:0 auto;
            opacity:0.9;*/

        }

        /* ----------------  FOOTER --------------*/
         #footer{
            margin-top:0px;
            margin-left:-10px;
            height:200px;
            width:101%;
            background-color: #000;
            opacity:0.8;
        }

        /*---------------- RESPONSIVE DESIGN STYLING ------------------------*/

        @media only screen and (min-width: 310px) and (max-width: 960px) {
         body {

         }

         #wrapper{
            width:310px;
            height:1600px;
         }

         #heading{
            margin:0 auto;
         }

         #lijevi{
            width:310px;


         }

         #desni{
            width:310px;
            margin-left:0px;
            float:none;
         }
        }
        /* ---------------------------------------------------------------------*/

        /* KALENDAR STYLING */

        .kalendarframe{
            height:1000px;
            padding-top:80px;

            /*margin-bottom:0px;*/
        }

        .kalendar{
            width:100%;
            height:1000px;
        }


        /* ---------------------*/

Answer 1

Did you also try setting height for the iframe?