pureSmugBlack CSS is TOO POWERFUL!

[aaronbrown]

Is there a way to override the pureSmugBlack CSS that is called when I use the SmugMug Gradient theme?

For example, I want to change the:

.glyphButton .first-child, .yui-menu-button button {
background-image: url(http://cdn.smugmug.com/img/buttons/bg/white_gradientdkgray-2.gif);
}

into the white icons and not the green ones.

I don't want to revert all my pages to default and then try to rebuild the gradient boxes and color schemes that are included in the SmugMug Gradient theme like I had to do with my journal page about me:
http://aaronbrownphotos.smugmug.com/gallery/6690717_VVkEz
I just want to ammend what's already there.

I guess what my question is: why doesn't our CSS override all other CSS?

It's driving me bananas! :crazy

Thanks!

Aaron
http://www.aaronbrownphotos.com
http://aaronbrownphotos.smugmug.com

[jfriend]

Is there a way to override the pureSmugBlack CSS that is called when I use the SmugMug Gradient theme?

For example, I want to change the:

.glyphButton .first-child, .yui-menu-button button {
background-image: url(http://cdn.smugmug.com/img/buttons/bg/white_gradientdkgray-2.gif); (http://cdn.smugmug.com/img/buttons/bg/white_gradientdkgray-2.gif%29;)
}

into the white icons and not the green ones.

I don't want to revert all my pages to default and then try to rebuild the gradient boxes and color schemes that are included in the SmugMug Gradient theme like I had to do with my journal page about me:
http://aaronbrownphotos.smugmug.com/gallery/6690717_VVkEz
I just want to ammend what's already there.

I guess what my question is: why doesn't our CSS override all other CSS?

It's driving me bananas! :crazy

Thanks!

Aaron
http://www.aaronbrownphotos.com
http://aaronbrownphotos.smugmug.com
CSS is processed in order. If two CSS rules have the same specificity, the one that comes last has priority. Themes come after our customization. I'm not sure I understand that logic, but it is the way it is.

So, if you want to override something in a theme, then there are two ways to do that. First, you can use a higher specificity (which means specifying more relevant IDs and classes to target the CSS rule more precisely.

Or, you can make the rule !important which will override anything else at the same specificity, even things that come after it.

So, you can accomplish what you want by just adding !important to a rule like this in your own CSS and it will override everything else with the same specificity that doesn't also have !important on it. By definition, none of the themes have !important on them so that we can always override them if needed.

.glyphButton .first-child, .yui-menu-button button {
background-image: url(http://cdn.smugmug.com/img/buttons/bg/white_gradientdkgray-2.gif (http://cdn.smugmug.com/img/buttons/bg/white_gradientdkgray-2.gif)) !important;
}

[aaronbrown]

CSS is processed in order. If two CSS rules have the same specificity, the one that comes last has priority. Themes come after our customization. I'm not sure I understand that logic, but it is the way it is.

So, if you want to override something in a theme, then there are two ways to do that. First, you can use a higher specificity (which means specifying more relevant IDs and classes to target the CSS rule more precisely.

Or, you can make the rule !important which will override anything else at the same specificity, even things that come after it.

So, you can accomplish what you want by just adding !important to a rule like this in your own CSS and it will override everything else with the same specificity that doesn't also have !important on it. By definition, none of the themes have !important on them so that we can always override them if needed.

.glyphButton .first-child, .yui-menu-button button {
background-image: url(http://cdn.smugmug.com/img/buttons/bg/white_gradientdkgray-2.gif (http://cdn.smugmug.com/img/buttons/bg/white_gradientdkgray-2.gif)) !important;
}

Well, that'll do just fine then! :)
Thanks for the info. I wish I knew that before redesigning my journal page!

Thanks though, John. You're a weath of !importance to me.

Aaron