Layout Positioning is one of the more powerful and difficult aspects of style sheets to master. Using style sheets, you no longer will need to use a table in order to lay out the page.

This text goes in the middle of the page, or I should say the right 79%. It's positioned for the rest of the page, and should flow around the edges with a slight indentation on the paragraph. You can't indent paragraphs in normal HTML. The left part of the screen is 21% of the page -- it should probably be set to a fixed pixel width, it's distracting to have both that part and the text part reflow when you resize your browser window.

One of the tricks with cascading style sheets is figuring out what overrides what. The style associated with your tag comes first, whether it's browser style, or has been redefined in the style sheet. You can override that with a class= modifier, or you can specify style attributes directly in the paragraph tag (which is hard to maintain and read). Note that modifiers like <strong> are properly displayed.

One thing which makes CSS a little hard to use for people used to using Dreamweaver is that Dreamweaver's page view doesn't render all of the CSS attributes you'll see in the browser, and it displays positioned elements as if they were div layers.

Note that this page is set up as a div layer, which made sense for the positioning attributes -- applying position to the paragraph tags didn't quite work the way I'd expect. Not sure why, but I'm finding that some attributes are ignored for some tags, and not others.

Some links relating to CSS:

Using CSS sprites instead of rollovers

CSS Zen Garden -- this site shows the power of CSS to change presentation without changing content in a very slick way. If you download the HTML file, you'll see that the basic tags are very simple.