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 Coder
    Join Date
    Dec 2009
    Posts
    39
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Problems with the footer image..

    Well, I finally decided to update an old website, but as I was updating it, the header and footer did show the way I wanted it to show up. The footer image does not stretch all the way to the left/right. As well, the header image is too tall, making everything else lower down on the page.

    Here's the code, I'm sorry I don't have a domain name yet, so I just uploaded to a filehost. http://www.mediafire.com/?mwaldzu2zwy You should be able to see what I'm talking about pretty quickly..

    Thanks in advance.

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,738
    Thanks
    22
    Thanked 1,836 Times in 1,820 Posts
    Hello shadowsai,
    You're missing the closing tag for #container.
    Make your markup look like this -
    Code:
    <p>Kabok Music School offers lessons <b>throughout</b> the school year and during the summer. <b>Intake is continuous</b>. Tuition is calculated by school year and depends on the date of enrolment as well as the length, type and frequency of lessons.
            Please call us at 604-517-4551 for more information about fees. If you are interested in taking lessons, we invite you to make an appointment for a no-commitment interview with one of our teachers. This interview is free. Please see our <a href="faculty.htm">Faculty </a> page for teacher photos and biographies. </p>
          <div class="margin_bottom_10"></div>
          <div class="rc_btn_02"><a href="register.htm">More Info...</a></div>
        </div>
        <div class="margin_bottom_30"></div>
      </div>
      <div class="cleaner"></div>
      <!-- end of content right --></div>
    <!-- end of container --></div>
    <div id="footer_wrapper">
      <div id="footer"> Copyright © 2009 <a href="index.htm">Kabok Music School</a> | Designed by <b>ѕαι</b></a> </div>
      <!-- end of footer -->
    </div>
    </body>
    </html>

    It would be best to crop that image your using for a background on your header.
    This kind of works for now too...adjust the highlighted parts to your liking -
    Code:
    body {
    	margin: 0;
    	padding: 0;
    	line-height: 1.5em;
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	color: #666;
    	background: #fff url(images/main_bg.jpg) repeat-x 0 -125px;
    }
    #content_right2 #top_menu {
    	height: 40px;
    	text-align: right;
    /*padding-top: 70px;*/
    	padding-right: 30px;
    	padding-bottom: -20px;
    	padding-left: 0;
    }
    
    #site_title {
    
    	color: #e0f2e8;
    	height: 105px;
    padding: 50px 0 0 0;
    }
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #3
    New Coder
    Join Date
    Dec 2009
    Posts
    39
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks, the header is all fixed now.. I never noticed that I forgot the closing tag for the container. But the footer still is the same? It doesn't stretch the whole screen like the header does. Any ideas guys?


  •  

    Posting Permissions

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