I'd like to put all my formatting in one place by using CSS. Should I put everything on the stylesheet eg
osition, size, colour...
Are there any guidelines that I should follow? EG How do I group my elements? What if there are loads of elements all exactely the same except for their position? Should I give them all a seperate ID??
Ideas/ Tips much appreciated
As a whole I would try to keep all my CSS on an external Cascading Style Sheet and avoid nested styles. I say this because it is much easier to keep ontop of all your styles to stay in control of your layout.
As far as overiding styles, it really depends on the size of the changes needed or the situation in which they evolve.
DavidMy preference is to put anything common to the site in one or more stylesheets, as that way global changes can be made in one place. I will make a second style sheet for things that are common to a subset of the site. Those things that only pertain to an individual page get stored inline in the head section. I even (and the purists will complain) sometimes code small bits of style in the tag itself when it is a one-off thing. This last at least has the advantage of consistency, rather than using the (deprecated) html formatting options.
As for position, I have so far stayed with static positioning and some floating divs. While useful in some cases, absolute positioning can be a real problem generator, especially for beginners.
As part of the overall design of a site, I decide upon the body text typeface and size, and then the heading levels. These get set in the site common CSS sheet. Heading, footer and menu styles also go into either the first stylesheet, or sometimes the menu gets its own sheet for clarity's sake.
Remember that CSS stands for "cascading" -- start with the absolute common denominator definitions on the outermost elements, and let inner elements inherit. Then, you can override or enhance the basic definitions by defining styles relative to their parent elements (i.e., #content p { } would apply to paragraphs inside the element id'd as "content" - typically a div - but not to paragraphs outside of "content").
Oh, and really learn how the box model works. Until you've got that down, you're going to struggle.If you want a quicky guideline to which it's easy to find exceptions, consider the scope of the style being set.
[site] - external stylesheet
[page] - embedded stylesheet
[element] - inline style
osition, size, colour...Are there any guidelines that I should follow? EG How do I group my elements? What if there are loads of elements all exactely the same except for their position? Should I give them all a seperate ID??
Ideas/ Tips much appreciated
As a whole I would try to keep all my CSS on an external Cascading Style Sheet and avoid nested styles. I say this because it is much easier to keep ontop of all your styles to stay in control of your layout. As far as overiding styles, it really depends on the size of the changes needed or the situation in which they evolve.
DavidMy preference is to put anything common to the site in one or more stylesheets, as that way global changes can be made in one place. I will make a second style sheet for things that are common to a subset of the site. Those things that only pertain to an individual page get stored inline in the head section. I even (and the purists will complain) sometimes code small bits of style in the tag itself when it is a one-off thing. This last at least has the advantage of consistency, rather than using the (deprecated) html formatting options.
As for position, I have so far stayed with static positioning and some floating divs. While useful in some cases, absolute positioning can be a real problem generator, especially for beginners.
As part of the overall design of a site, I decide upon the body text typeface and size, and then the heading levels. These get set in the site common CSS sheet. Heading, footer and menu styles also go into either the first stylesheet, or sometimes the menu gets its own sheet for clarity's sake.
Remember that CSS stands for "cascading" -- start with the absolute common denominator definitions on the outermost elements, and let inner elements inherit. Then, you can override or enhance the basic definitions by defining styles relative to their parent elements (i.e., #content p { } would apply to paragraphs inside the element id'd as "content" - typically a div - but not to paragraphs outside of "content").
Oh, and really learn how the box model works. Until you've got that down, you're going to struggle.If you want a quicky guideline to which it's easy to find exceptions, consider the scope of the style being set.
[site] - external stylesheet
[page] - embedded stylesheet
[element] - inline style