Syndicate content
> CSS Positioning : Tips on Positioning

CSS Positioning : Tips on Positioning

Introduction and Overview
Position: Static, Relative, Absolute, and Float
Tips on Positioning
Bugs?
Further Reading & Conclusion


Tips on Positioning

I have found the best results with using floats and absolute with relative positioning, and "flexible" widths (%). An example of something I would do can be found in this article: Flexible Positioning with CSS.

I like to use "wrapper" divs to achieve as consistent layouts as possible. That's not a technical term, but a commonly used word to describe what it does -- it "wraps" around the element I want to position but does not contain any information in itself.

Example:

<div id="header">header</div>

<div id="main"> <!-- this is the "wrapper" -->

<div id="content">content</div>
<div id="navigation">nav menu</div>

</div>

<div id="footer>footer</div>

Then I decide which positioning method I want to use. Admittedly, there are bugs no matter which method you choose, however, many can be worked around.


Mary
Mary is an active member of the Christian-Web-Masters.Com forums. You can find her there to bug her about anything. Alternately, you can visit her website, and check out some other tutorials and free goodies.

Christian-Web-Masters.com newsletter

Stay informed on our latest news!