CSS priority
Permalink Browser Info Environment
Dear Developer,
I faced an issue by try to change the styling of my search block.
I use the free "Ronyd Expand Search Bar" add-on because of the nice expanding feature.
I've sucessfully changed the styling from the search button, what ever I like, works fine.
But for the text input part I face problems because the CSS properties out of the foundation.custom.min.css settings are stronger than my individual settings in the view.css from the add-on.
For example I simply like to make "border-radius: 30px;", shrink the form size so I need to shrink the font-size and change the bg color. Normaly not a big deal, right?
Who can give me support in there?
Best wishes
Danny
I faced an issue by try to change the styling of my search block.
I use the free "Ronyd Expand Search Bar" add-on because of the nice expanding feature.
I've sucessfully changed the styling from the search button, what ever I like, works fine.
But for the text input part I face problems because the CSS properties out of the foundation.custom.min.css settings are stronger than my individual settings in the view.css from the add-on.
For example I simply like to make "border-radius: 30px;", shrink the form size so I need to shrink the font-size and change the bg color. Normaly not a big deal, right?
Who can give me support in there?
Best wishes
Danny
| Type: | Discussion |
|---|---|
| Status: | In Progress |
Hi,
do I get your answer right that what ever add-on I use in combination of your theme, I have to live with the fact, that non suitable css properties I usually can set in that add-on, will not work if your theme is using that proberty in your theme css files? For example a simple input form I like to have with other borders than you have specified for textareas?
This means I have to take the !important option to get my styling requirements fulfilled, right?
Best wishes
Danny
do I get your answer right that what ever add-on I use in combination of your theme, I have to live with the fact, that non suitable css properties I usually can set in that add-on, will not work if your theme is using that proberty in your theme css files? For example a simple input form I like to have with other borders than you have specified for textareas?
This means I have to take the !important option to get my styling requirements fulfilled, right?
Best wishes
Danny
As per my last message, you may consider adding a more specific declaration to your CSS - no need for an !important...
For example:
For example:
.ccm-page input[type=text].sb-search-input { border-radius: 30px; }
Thanks, now I got the right syntax from your new suggestion and it works!
Before I did wrong with this: "div.ccm-page sb-search-input { ... }".
Before I did wrong with this: "div.ccm-page sb-search-input { ... }".
i.e. start with div.ccm-page to make sure you are targeting the element more specifically.