A CSS based layout that is, a layout that uses block elements instead of 

table rows and columns contains much less code than a table based 

layout of the same nature. CSS based layouts generally use 

 tags 

instead of 

 tags to create CSS layout blocks used for layout. You 
can position these CSS layout blocks anywhere on the page, and assign 
properties to them such as borders, margins, background colors, and so on. 
Additionally, people using screen readers to view web pages have a much 
easier time browsing pages built with CSS because the code is simpler and 
shorter.
Dreamweaver lets you create layers. A Dreamweaver layer is an HTML 
page element that you can position anywhere on your page. More 
specifically, it is a 
 tag (or any other tag) with an absolute position. 
You use Dreamweaver to drag layers on your page and then position the 
layers where you want them. The layers act as content blocks that hold 
assets like images, Flash files, text, and so on.
Dreamweaver layers are absolutely positioned elements. That is, they have 
a specific position that is set relative to the top and left margins of the page. 
You cannot create a CSS based layout with layers and then center the 
contents of the page. Thus, the layout in this tutorial is slightly different 
than the one you created in 
Chapter 4,  Tutorial: Creating a Table based 
Page Layout 
.
For more information about Dreamweaver layers, see Chapter 7,  Laying 
Out Pages with CSS  in Using Dreamweaver.
Examine the design comp
NO
If you already completed 
Chapter 4,  Tutorial: Creating a Table based 
TE
Page Layout 
 and examined the design comp, you can proceed to the 
next section to immediately begin creating your CSS based layout.
Typically, you don't begin building a website by opening Dreamweaver and 
laying out pages right away. The first steps to creating a website begin on a 
piece of paper, or in a graphics editing application like Macromedia 
Fireworks. Graphic designers usually sketch out a piece of comprehensive 
artwork (also known as a  comp ) for the website in order to show it to the 
client and make sure that the initial ideas for the site meet with their 
client's approval.
154 Tutorial: Creating a CSS based Page Layout












  
 
 

        
 
 
  

    

      

      
 Home 
      | About Us | Network 
      | Services | Support 
      | FAQ | Control Panel 
      | Order Online |
      Sitemap | Contact
      

      dreamweaver web hosting
      
 
    
  
  

Our partners: 
PHP: Hypertext Preprocessor Best Web Hosting
Java Web Hosting
Jsp Web Hosting
Cheapest Web Hosting
Visionwebhosting.net Business web hosting division of Web 
Design Plus. All rights reserved