Skip navigation
Currently Being Moderated

Help! Making Ap DIVs relative so they move with the rest of the page.

Jan 3, 2013 3:09 PM

Tags: #content #dreamweaver #ap #divs

Help!  I'm stuck.  I know that I used AP DIVs wrong and now I need to correct it.  Here is a link to one of the pages that is messed up.

As you can see, the page moves when resizing the window, but the box of content in the middle does not.


Is there any way to fix this?  I'm a beginner.


Thank you.


  • Currently Being Moderated
    Jan 3, 2013 3:13 PM   in reply to bls201314

    Short of re-designing your layout without positioning, your could wrap your APDivs inside a relative positioned parent container.


    body {

        background-attachment: scroll;

        background-color: #000;

        background-repeat: repeat;

        background-position: center top;






    Nancy O.

    Mark as:
  • Currently Being Moderated
    Jan 3, 2013 3:24 PM   in reply to bls201314

    The <body> tag is the parent container of ALL containers in your page. 


    Open your CSS code and add position:relative to what you now have in your body selector.



    Nancy O.

    Mark as:
  • Currently Being Moderated
    Jan 3, 2013 3:59 PM   in reply to bls201314

    Once I do that, then do I need to place my APDiv content box code somewhere?

    Nope. Your content is already inside the <body> tag, right?


    You should test your site in browsers with increased text sizes to make sure it's accessible though.


    In Firefox, go to View > Zoom > Text only.  Hit Ctrl++++ to see what happens.

    More often than not, APDivs cause text to get cut off because they are removed from the normal document flow.   This is one reason APDivs are such a poor layout method.


    Finally, be sure to validate your code & fix reported errors.


    Ampersands in code should be changed to & amp ; (without the spaces).



    Nancy O.

    Mark as:
  • Currently Being Moderated
    Jan 4, 2013 9:05 AM   in reply to bls201314

    Try replacing this:


    #apDiv32 {

    position: absolute;

    width: 1278px;

    height: 1988px;

    z-index: -5;

    background-color: #000000;

    left: -3px;

    top: -2px;



    with this:


    #apDiv32 {





    You might want to add a CSS background-gradient to your body selector so the page doesn't have that blank white region under the form:




    Nancy O.

    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points