5 Replies Latest reply on May 31, 2010 12:12 PM by iconofsin14

    AP DIV tags

    iconofsin14

      Back in 2003 when i was making web sites i would create the layout by using some sort of tag which i cant remember the name of. I think it was called a table tag (but definitly not the sort of tables you would get in MS word). It definitly was not a frameset.

       

      You would draw a "area" which i think appeared in green and then draw spaces within that area which things could be placed in.

       

      I cannot find this tag/function in dreamweaver cs5

       

      what i have discovered is a AP DIV tag which works in a similar way excet the boxes can be drawn anywhere and not limited to your pre defined area and the code for them appears in the head (the old one was in the body)

       

      does anyone know what i am talking about and are AP div tags a good alternative to my old method?

       

      also if i change the ID name these boxes convert into ordinary div tags (by that i mean the look like ordinary div tags in design view) why is this?

        • 1. Re: AP DIV tags
          Ben M Adobe Community Professional

          AP divs are what you are talking about but using only AP divs for a layout is typically a bad idea because each user will have different screen resolutions and some will use accessibility settings which can drastically alter your site if you are trying to fit AP divs around a page like you would layers in an InDesign document.

           

          The reason why the positioning is lost when you rename the ID is because of CSS.  The positioning is linked to the CSS.  Thus if you change the ID name of the div you need to update your CSS document to match the name, otherwise the positioning will be lost.

          • 2. Re: AP DIV tags
            iconofsin14 Level 1

            I do like using AV divs to position objects like you would with indesign or ms publisher.

             

            you say its able to cause display problems due to resolutions and accessability

             

            I design my pages with 1024x768 in mind as this is typically the lowest resolution anyone will use but it is perfectally acceptable and sites which use it and fill the rest of the width screen with a background look clean. (this forum does this in fact)

             

            if AV divs are such a bad idea what is a good alternative method of page layout?

             

            Also ive noticed that divs and av-divs generate the exact same HTML code. so how exactly do they differ (other than the fact that dreamweaver lets you postition one in the same way you would position an object in indesign but does not allow this with the other)?

            • 3. Re: AP DIV tags
              Nancy OShea Adobe Community Professional & MVP

              Back in 2003 when most sites were still being built in tables, DW had a feature called Table Layout Mode.  It allowed you to draw tables on your page in Design View.  Adobe saw fit to remove Layout Mode because the complex table and column span code was horrible.  Also the table trend was ending as more and more web designers discovered the virtues of CSS based layouts.

               

              On the surface, APDivs (absolutely positioned divs or layers) may seem like a good idea but they aren't.  This link explains the pitfalls http://apptools.com/examples/pagelayout101.php

               

              Default CSS positioning (which is no positioning at all) is all you need for the majority of your page layout.  Then add CSS padding, margins and floats to align elements where desired.

               

              From Tables to CSS Web Design Part 1 -
              http://www.adobe.com/devnet/dreamweaver/articles/table_to_css_pt1.html

               

              From Tables to CSS Web Design Part 2 -
              http://www.adobe.com/devnet/dreamweaver/articles/table_to_css_pt2.html

               

               

              Nancy O.
              Alt-Web Design & Publishing
              Web | Graphics | Print | Media  Specialists
              http://alt-web.com/
              http://twitter.com/altweb
              http://alt-web.blogspot.com

              • 4. Re: AP DIV tags
                iconofsin14 Level 1

                I see that makes it clear now

                is is acceptable to use css to define a div boxes height and width?

                • 5. Re: AP DIV tags
                  Nancy OShea Adobe Community Professional & MVP

                  I see that makes it clear now

                  is is acceptable to use css to define a div boxes height and width?

                  Width yes.  Height no. Content and browser settings will determine the height of a division. If needed to reveal a background image, for example, you can use the min-height property.

                   

                  Floats & Margins Demo - 3 evenly spaced boxes

                  http://alt-web.com/DEMOS/3-CSS-boxes.shtml

                   

                   

                  Nancy O.
                  Alt-Web Design & Publishing
                  Web | Graphics | Print | Media  Specialists
                  http://alt-web.com/
                  http://twitter.com/altweb
                  http://alt-web.blogspot.com