Need Header & Footer Troubleshooting Help

Discussion in 'CSS' started by zakster, Sep 21, 2010.

  1. #1
    I need an extra set of eyes to troubleshoot an existing website…

    I decided to re-write the stylesheet (from a previous outsourcer) because it was too code heavy and in the process i've managed to move the footer to the far right of the main content instead of falling to the bottom. Also, when I add a transparent image to the header, I'm losing the header bg. Oh, and there's an added empty line between the nav image and the main content.

    I’ve mucked around with this for so long that I’ve lost track of what I’m looking for and can’t “see” the problems.

    Anyone feel like taking a stab at this??

    I uploaded the original site to http://offlinenet.com/test1 and the “do over” is at http://offlinenet.com/test1/do-over

    Thx in advance for your help :)



    <body>
    <div id="heading">
    <div id="container">

    <div id="logo">
    </div> <!-- END LOGO -->

    <ul id="nav">
    </ul> <!-- END NAV -->

    <div align="center"> <!-- BEGIN Image Map -->
    <img src="image.png" border="0" width="897px" height="227px" usemap="#map" />
    <map name="map" id="map">
    <area shape="rect" coords="10,46,142,218" href="#" />
    <area shape="rect" coords="159,71,291,218" href="#" />
    <area shape="rect" coords="306,85,439,218" href="#" />
    <area shape="rect" coords="456,87,590,217" href="#" />
    <area shape="rect" coords="605,72,739,217" href="#" />
    <area shape="rect" coords="754,48,889,218" href="#" />
    </map>
    </div> <!-- END CENTER --> <!-- END Image Map -->
    </div> <!-- END CONTAINER -->
    </div> <!-- END HEADING -->

    <div class="main">

    <div class="left">
    </div> <!-- END LEFT -->

    <div class="right">
    </div> <!-- END RIGHT -->

    </div> <!-- END MAIN -->

    <div class="clear"></div>

    <div id="footer">
    <div class="footer-container">
    <div class="wrapper">
    <div class="fleft">
    <img src="image.png" alt="" />&copy; All Rights Reserved
    </div>

    <div class="fright">
    <a href="#" target="_blank">Privacy</a>&nbsp; | &nbsp;
    <a href="#" target="_blank">About Us</a>&nbsp; | &nbsp;
    <a href="#" target="_blank">Contact</a>&nbsp; | &nbsp;
    <a href="#" target="_blank">Home</a>
    </div>

    </div> <!-- END WRAPPER -->
    </div> <!-- END FOOTER-CONTAINER -->
    </div> <!-- END FOOTER -->
    </body>



    CSS

    #container { margin:0 auto; width:960px; position: relative; font-size:.8525em; }
    .wrapper { width:100%; overflow:hidden; }
    .clear {clear: both and height: 0}
    #heading { height:380px; overflow:hidden; background:url(images/bg-hdrx.jpg) 0 0 repeat-x; }

    #map { margin-left: 30px; }
    .main {margin:0 auto; width:891px; }
    .main .left {float:left; padding:0 20px 0 45px;width:550px;font-size:.95em;}
    .main .right {float:left; background:url(images/content-separator.png) no-repeat; padding:0 51px 0 33px; width:187px; height: 313px; font-size:.95em; }
    .main .right {overflow:visible; zoom:1;}

    #footer {color:#000000; padding:20px 0 22px 0; border-top:5px solid #eee;}
    #footer .footer-container { margin:0 auto; width:960px; font-size:.8525em;}
    #footer .fleft { padding-left:20px; width:550px; overflow:hidden; }
    #footer .fright { padding-right:40px; width:250px; }
    #footer .fleft img { margin-left:-20px; overflow:hidden; }
     
    zakster, Sep 21, 2010 IP
  2. GWiz

    GWiz Peon

    Messages:
    359
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    0
    #2
    There are a lot of issues with your code and website in general. It would be helpful if you could explain each and every problem you're having trouble with, and also mention which browser the problem occurred in.
     
    GWiz, Sep 21, 2010 IP
  3. obehi

    obehi Member

    Messages:
    62
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    43
    #3
    It would also be really cool if you could upload your site to a server, so that we could view the site with firebug, Makes life so much easier :)
     
    obehi, Sep 22, 2010 IP
  4. zakster

    zakster Member

    Messages:
    36
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    41
    #4
    thx folks - yes, i know there were other issues but the priority was to find the bugs for the footer and header. These were "found" yesterday, after which I tackled the minor problems. It's all good now. Am going to remove the files that I uploaded for the post so the links in the OP are no longer valid.

    Thx anyway...
    (gotta love forums!)
     
    zakster, Sep 22, 2010 IP