5 Replies Latest reply on Feb 18, 2010 7:35 AM by osgood_

    how to put footer within my wrapper

    Jennigje Galama Level 1

      Hi,

       

      I have a page layout issue.

       

      The footer of my page will not align with the rest of my page. I figure that is because it is not sitting within the wrapper, but I do not know how to fix it.

       

      I hope someone can help me with this.

       

      Jen

        • 1. Re: how to put footer within my wrapper
          osgood_ Level 8

          The footer (copyright) does not necessarily need to be within the 'wrapper' <div>

           

          Change the attributes of the 'copyright' selector from:

           

          #copyright {
              padding: 2px 0 5px 20px;
              font-size:10px;
              background-color:#060;
              font-weight: bold;
              color: #000;
              margin-top: -1em;

          }

           

          To this:

           

          #copyright {
               padding: 2px 0 5px 20px;
               font-size:10px;
               background-color:#060;
               font-weight: bold;
               color: #000;
               clear: both;
              width: 875px;
              margin: 0 auto;

          }

          • 2. Re: how to put footer within my wrapper
            Jennigje Galama Level 1

            That is very helpful, thank you so much


            • 3. Re: how to put footer within my wrapper
              stevetamis

              Half the websites out there have what is called a footer, or a block at the bottom of the page with quick links. For example, my website has a footer at the bottom of the page if you scroll down with links to major sections of my site. When I was looking into implementing this on my site, I ran into some problems. On some pages, the content didn’t fill the whole screen (which also varies with different screen resolutions, so the footer would be in the middle of the screen. Obviously, on pages where the content went past the bottom of the screen, this wouldn’t be a problem because the footer would be pushed to the bottom. So clearly, I needed a footer that would “stick” to the bottom of the screen if the content wouldn’t push it, but if there was enough content, then it would be below the screen bottom. I searched and searched for solutions, and I found one which I adapted just a little bit into my own implementation. r4 card

              • 4. Re: how to put footer within my wrapper -open again
                Jennigje Galama Level 1

                HI,

                 

                I am having some issues with the code suggested to me the other day.

                 

                I tested it on one of my sites but the footer text sits somewhat outside of the footer 'box"

                 

                have a look at www.inspiratieencoaching.nl and look at the footer. How do I fix that?

                • 5. Re: how to put footer within my wrapper -open again
                  osgood_ Level 8

                  Jennigje Galama wrote:

                   

                  HI,

                   

                  I am having some issues with the code suggested to me the other day.

                   

                  I tested it on one of my sites but the footer text sits somewhat outside of the footer 'box"

                   

                  have a look at www.inspiratieencoaching.nl and look at the footer. How do I fix that?

                   

                  Remove <center></center> from the code below (where did that crap come from?)

                   

                   

                  <p id="copyright"><center>©2010, <a href="contact">Contact met Joan Galama</a> |
                  <a href="http://www.trafficact.com.au">Site gebouwd door Traffic Act</a></center></p>

                   

                   

                  Then add text-align: center; to the 'copyright css selector.

                   

                  I have to also tell you YOU SHOULD NOT be setting heights on your <div> containers UNLESS you know what height they will eventually be and there is only two ocassions that you will know that:

                   

                  1) If you have an image/s in the div and nothing else.

                   

                  2) If you intent to set the div to scroll at a given height.

                   

                  If you set height then that will lead to a lot of chaos on your page.