Best way to customize styles?

[airandfingers]

Hi, I’m customizing the theme’s colors and layout according to my preferences, but I keep running into problems with CSS specificity.

This is because even if I copy the selectors used by responsive.css into my sweetdate-chidl/style.css, these styles are ignored since responsive.css is included later than style.css.

My current workaround is to edit the PHP files to add ID attributes and select those instead, but I’d prefer a CSS-only solution.

Is there a preferred way to include a custom CSS file that will be loaded after all other CSS files, so that it can override their styles with the same selectors?

[Laura]

Hello, there shouldnt by any issue with css, what element are you editing ?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[airandfingers]

As an example, we wanted to change the header color, so we tried to use the same selector, .header-bg. However, our style declaration in style.css is overridden by the theme’s inline definition with the same selector.

So, as a workaround, we added an id attribute of the same name to that element, and then used the selector #header-bg instead.

I set up an example for you to see at http://social.youtopiaproject.com… our .header-bg style (background: #08719c”) is overridden by an inline style using the same selector.

[Laura]

Hello, will assign the ticket to a higher support level who can help and advise you in your query.
Thanks! ?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[airandfingers]

Thanks!

[Radu]

Hi,

It’s ok if you put your CSS selectors in wp-content/themes/sweetdate-child/style.css

If the rules are not applied specify the important declaration

Example

h1 { font-weight: bold !important; }

Let me know

Cheers
R.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[airandfingers]

Hm, I know that I can always use !important, but I understand that it’s not a great solution.

It’d be better if style.css was loaded last in the list of stylesheets, so that even with the same selectors it’d override responsive.css and others.

[Radu]

Normally style.css form child it’s loaded latest… but you don’t have child theme installation from what can i see in chidl theme

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[airandfingers]

This reply has been set as private.

[Radu]

Hi,

I saw that the CSS from themes/kleo-child/style.css it loads thru the site if some rules not applying use !important for those.

Cheers
R.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[airandfingers]

Okay, we’ll keep using workaround like !important and adding ID attributes then.

Cheers,
Aaron

[Radu]

Ok then
Cheers
R

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[Author]

Posts