1 Reply Latest reply on Mar 9, 2010 8:08 AM by osgood_

    drifting div boxes

    ED-H Level 1

      I have just about gained full control over my div boxes using CSS, but my footers always seem to drop, leaving a gap below the content div. All butting margins are set to 0. My latest site has no gap on the index page, but gaps on all the others, and they're all linked to the same style sheet!?

      Check out: turtlerockstudiomarketing.com  Thanks!

        • 1. Re: drifting div boxes
          osgood_ Level 8

          In your code you have two paragraph tags, which use non-breaking spaces (see code snippet below). You have inserted them to create some space between the form button and the footer <div>. They are causing the space between the <divs>, this is not the way to create space. Delete the paragraph tags and amend the padding on the 'content' css to padding: 0 0 20px 0; (as shown below)

           

          </div>
          <p> </p> /* delete this */
            <p> </p> /* delete this as well*/
          </div><!-- end content -->
            <div id="footer">

           

           

          #content {
              width: 860px;
              font-family: Arial, Helvetica, sans-serif;
              font-size: 16px;
              text-align: left;
              vertical-align: top;
              color: #CCC;
              margin-top: 0px;
              margin-bottom: 0px;
              background-color: #300;
              padding: 0 0 20px 0;
          }