CSS Layout Questions
Although I have been designing sites for several years using table-based layout, I am new to CSS Layouts and that is why I purchase CSS Sculptor and am trying to understand the proper way of using CSS to layout a site and have a few questions as to how/why CSS Sculptor formats the CSS the way it does.
An example would be:
#outerWrapper #mainContentWrapper #insideContentWrapper #content #equipment a:link, a:visited
1) I could understand this if every div needs the properties of #outerWrapper but if they don't then shouldn't it be formatted like this instead?
#outerWrapper {
formatting }
#mainContentWrapper {
formatting }
#insideContentWrapper {
formatting }
#content {
formatting }
#equipment a:link, a:visited {
formatting }
2) Also, I have seen on several sites where the CSS div is formated differently and am trying to understand the use or do they all do the same thing?
#wrapper
div#wrapper
d.wrapper
3) Using Resets. I understand the concept of using resets at the top of a css file in case a tag isn't closed but what is the proper formatting?
Is this how a CSS file should be formatted:
Resets (i.e., HTML, Body, p)
Layout DIVs (i.e., #wrapper, #contentWrapper, #leftColumn, #content)
Classes (i.e., img border, etc.)
So should the classes be located at bottom of the CSS file, unless they are specific to a DIV?
I have noticed this because I am continuously running into problems with styling links differently depending on which section I'm on. Many times the previous link style gets overwritten by the one that comes after it so I am trying to understand how this works. For example, if I define my site wide links at the top of the CSS and then get more specific and do #content a:link, #leftColumn a:link, #content a:link, and have these all different, shouldn't each div link be styled differently?
Thanks,
Lisa