DCElliott
06-27-2003, 05:44 AM
I came across a neat layout trick the other day. It involves the use of a 100px square gif that you use in your background. It is useful when you are working out your positioning because you can quickly estimate the pixel positioning.
Here is the Layout Grid Example (http://www3.ns.sympatico.ca/d.elliott/layout.htm)
Also included in this page is an illustration of creating a horizonatally and vertically centered division that stays centered when the page is resized. It also contains two absolutely positioned divs that take their sizing from the parent. I also show an example of using two classes in a single tag.
Also look at the CSS - I crab at folks for mixing up their style blocks. Note the consistent progression of properties from display, position, height/width, margins/padding/borders, and only then to the presentational features. Writing your properties in this order is a good habit and makes your CSS easier to code and maintain.
Enjoy!
DE
Here is the Layout Grid Example (http://www3.ns.sympatico.ca/d.elliott/layout.htm)
Also included in this page is an illustration of creating a horizonatally and vertically centered division that stays centered when the page is resized. It also contains two absolutely positioned divs that take their sizing from the parent. I also show an example of using two classes in a single tag.
Also look at the CSS - I crab at folks for mixing up their style blocks. Note the consistent progression of properties from display, position, height/width, margins/padding/borders, and only then to the presentational features. Writing your properties in this order is a good habit and makes your CSS easier to code and maintain.
Enjoy!
DE