css overload understanding check

[Harrzack]

Before I go ripping and tearing, I'd like a confirmation on my understanding of the css structure.

The css for the currently selected Theme is loaded AFTER the User css. Thus the User css can only ADD new classes and ID's -- it can't overload existing elements.

If this this is true, and I do want to overload an element - say "body". I would REMOVE "body" from the theme, and move it to the User css. Since the BODY css now lives only in the User section I woudl have total control over it and can create various versions.

True? :scratch

[ivar]

Before I go ripping and tearing, I'd like a confirmation on my understanding of the css structure.

The css for the currently selected Theme is loaded AFTER the User css. Thus the User css can only ADD new classes and ID's -- it can't overload existing elements.

If this this is true, and I do want to overload an element - say "body". I would REMOVE "body" from the theme, and move it to the User css. Since the BODY css now lives only in the User section I woudl have total control over it and can create various versions.

True? :scratch I'm not sure what you mean by 'overload', and you can't add classes/ids in CSS, but I think I know what you are saying.


The user CSS is loaded before the themes CSS, that is correct.

CSS will be overridden if the same property and value of the same selector (element) are specified again 'downstream'.body { background-color: #000; }
body { background-color: #fff; }

will result in a white (#fff) background.
If you have a theme which you want to use, but you want to style certain elements different from the original theme, the best thing to do, is copy the entire existing theme, and save it as a new, custom theme. You can make the changes directly in the theme, and don't have to worry about which comes first, as you are only loading the theme that you created.

Alternatively, you can copy the entire theme and put it in your user CSS. That way, you are only loading the user CSS and not the themes CSS.

I hope this helps. Let us know if you have any questions.

[Harrzack]

Ivar -

"overloading" is an Object Oriented (OO) term - same as "overriding". :giggle

I do think you can create NEW classes and id's in the user css but they would have to also be used somewhere and would need to appear in some html somewhere. Which is how the nav button seem to work, with "navcontainer" and my own "main_banner".

I'm surprised that SM doen't have a user-defined css that loads last - it would seem to be more in the spirit of the overriding (overloading) concept of css. Not to mention simplify customization... or so it would seem to this SM-noob! :D

I will tinker a bit - no harm done as I have no traffic on the site yet anyway

Tks!

=Alan R.


I'm not sure what you mean by 'overload', and you can't add classes/ids in CSS, but I think I know what you are saying.


The user CSS is loaded before the themes CSS, that is correct.

CSS will be overridden if the same property and value of the same selector (element) are specified again 'downstream'.body { background-color: #000; }
body { background-color: #fff; }

will result in a white (#fff) background.
If you have a theme which you want to use, but you want to style certain elements different from the original theme, the best thing to do, is copy the entire existing theme, and save it as a new, custom theme. You can make the changes directly in the theme, and don't have to worry about which comes first, as you are only loading the theme that you created.

Alternatively, you can copy the entire theme and put it in your user CSS. That way, you are only loading the user CSS and not the themes CSS.

I hope this helps. Let us know if you have any questions.

[ivar]

I do think you can create NEW classes and id's in the user css but they would have to also be used somewhere and would need to appear in some html somewhere. Which is how the nav button seem to work, with "navcontainer" and my own "main_banner".No. Let's make sure we are on the right page here.

You create elements, and give it ids or classes in the HTML. That's the only place you can create elements.

CSS is a Style Sheet. It styles existing elements, it does not create them.
You can add code to style existing elements to the user CSS if you like.


If you want to read more about it, see http://www.dgrin.com/showthread.php?t=54833

Hope this helps. Let us know if you have any questions :thumb