Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Dec 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Footer Tag in Div / CSS

    Hey all i'm having a problem and am not sure how to fix it i've tried everything i can think of .. the website in question is www.theplacementoffice.com/index.php

    the "footer tag" is positionend for the bottom but isn't landing there

    Here is the HTML code of the site:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>The Placement Office | Home </title>
    <link href="http://theplacementoffice.com/WebTemplate.css" rel="stylesheet" type="text/css">
    </head>
    <body>
    <div id="container" style"">
    <div id="Banner">
    <img align="top" alt="Logo" border="0" height="251" src="images/plain.gif" width="100%">
    </div>
    <div id="Slogen">
    <p>Your Staffing Resource Partner</p>
    </div>
    <!-- Left Menu Section -->
    <div id="Menu">
    <ul>
    [[Wayfinder? &startId=`0`]]
    </ul>
    </div>
    <div id="Address">
    <p>Toll Free: 1-877-***-****</p>
    <p>**** Lucknow Dr, Unit # 3</p>
    <p>****, Ontario L5*****</p>
    </div>
    <div id="LatestNews">
    <p>Latest News</p>
    </div>
    <div id="NewsItems">
    <p>[!NewsItems!]</p>
    </div>

    <!-- Main Section Of Websuite -->
    <div id="Picture"><img src="images/Main_pic.gif" alt="" width="100%" height="368"></div>

    <!-- Main Text Area -->
    <div id="MainText" style="left: 203px; top: 472px; height: 197px">
    <h1>[*#introtext*]</h1>
    <p>To arrive at the best staffing</p>
    <p> solution, we provide the fallowing:</p>

    <div id="innertext" style="left: 286px; top: 16px; height: 174px">
    <p>[*#content*]</p>
    </div>
    </div>
    <div id="Footer">Copyright 2009</div>
    </div>
    <!--
    <table width="100%" valign="bottom" style="bottom:0;background-color:#860909;">
    <td valign="bottom">Copyright 2009</td>
    </table> -->
    </body>
    </html>
    The CSS IS:
    body {
    background-color: #f2e4c9;
    }
    #Banner {
    position:absolute;
    width:100%;
    height:115px;
    z-index:1;
    top:0;
    left:0;
    }
    #Slogen {
    position:absolute;
    width:30%;
    height:15px;
    z-index:8;
    top:83px;
    left:17px;
    font-size:20px;
    font-weight:bold;
    color:white;
    }

    #Menu {
    position:absolute;
    width:193px;
    height:225px;
    z-index:1;
    top: 210px;
    left:0;
    }
    #Menu ul{
    list-style-type: none;
    padding:0;
    margin:0;
    float:left;
    overflow:hidden;
    vertical-align:middle;
    }
    #Menu li{
    background-image:url('images/Button.gif');
    width:192px;
    height:35px;
    text-align:center;
    list-style: none;
    color:white;
    float:left;
    font-weight:bold;
    margin-left: auto;
    margin-right: auto;


    }
    #Menu li a:hover{
    background-image:url('images/redbuttondown.gif');
    width:192px;
    height:35px;
    text-align:center;
    list-style: none;
    color:white;
    float:left;
    font-weight:bold;
    margin-left: auto;
    margin-right: auto;
    }
    #Menu a:visited,#Menu a{
    color:white;
    text-decoration:none;
    }

    #Picture {
    position:absolute;
    left:203px;
    top:88px;
    width:79.8%;
    height:391px;

    }
    #MainText {
    position:absolute;
    width:559px;
    height:292px;
    z-index:3;
    left: 203px;
    top: 472px;
    margin:0;
    padding:0;
    }
    #Footer {
    position:absolute;
    bottom:0;
    width:100%;
    background-color:#860909;
    height:17px;
    left:0;
    font-family: Tahoma;
    font-size: 12px;
    font-weight: normal;
    color: #FFF;
    text-align:right;
    }

    #Address {
    position:absolute;
    width:193px;
    height:115px;
    z-index:5;
    left:0;
    top: 417px;
    background-color:#f9d398;
    }
    #Address p {
    margin-left:5px;
    left: 20px;
    font-weight:normal;
    font-size:12px;
    }
    #LatestNews {
    background-color:#b90c0c;
    position:absolute;
    width:193px;
    height:26px;
    z-index:6;
    left:0;
    top: 526px;
    }
    #LatestNews p {
    font-family: "Arial Black", Gadget, sans-serif;
    font-size: 12px;
    font-weight: normal;
    color: #FFF;
    text-align:center;
    margin-left: auto;
    margin-right: auto;
    margin-top:3px;
    }

    #NewsItems {
    position:absolute;
    width:193px;
    height:115px;
    z-index:5;
    left:0;
    top: 554px;
    background-color:#f9d398;
    margin:0;
    font-weight:normal;
    font-size:12px;
    }
    #NewsItems p {
    margin-left:5px;
    left: 20px;
    font-weight:normal;
    font-size:12px;
    }

    #innertext {
    position:absolute;
    width:272px;
    height:199px;
    z-index:7;
    left: 286px;
    top: 16px;
    }
    h1,h2,h3,h4,h5,h6 {
    font-family: Tahoma, Geneva, sans-serif;
    }
    h1 {
    margin-left:5px;
    font-size: 14px;
    color: #000;
    }
    ---- End of CSS --

    can anyone help ? Thanks !

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,862
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    It's one of the pitfalls of using absolute positions everywhere.
    I'd recommend to check a good 2 column layout at http://bonrouge.com/2c-hf-fluid.php
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New to the CF scene
    Join Date
    Dec 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    looking into this

    Thanks i'll look into that

    so i wasn't going crazy


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •