Tagged: ,

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • September 12, 2014 at 6:07 pm #318237
    ColinWalton

    I have read lots of posts about quick CSS and editing colour schemes – also about not touching anything in the main them (enfold) but only to use the child theme.

    So where EXACTLY do I change the style of the h3 headings to get rid of the rule that appears after the heading?

    Looking at the source code it has the class special-heading-inner-border

    Despite searching I can’t see any exact policy as to where things like this get edited.

    Am I meant to do a QuickCSS and put something like this:
    special-heading-inner-border { border-color: #FFFFFF; }

    But how would this OVERRIDE the current setting of border-color: #666666; ?

    I am sure there must be instructions on how to make this sort of change – plus others like padding and margin changes?

    Is there a manual I am missing?

    September 12, 2014 at 7:15 pm #318270
    Yigit

    Hi ColinWalton!

    Yes, you should add your custom CSS code to Quick CSS field inside Enfold theme options > General Styling tab or Custom.css file inside Enfold/Css folder of your theme or Style.css of your child theme. Please do not forget to add the dot in front of the class 

    .special-heading-inner-border { border-color: #FFFFFF; }

    Regards,
    Yigit

    September 15, 2014 at 9:51 am #319088
    ColinWalton

    Hi Yigit,

    Thank you for your reply. I tried exactly as suggested by adding it to QuickCSS, but as the border colour is already specified as:
    border-colour: #666666; the required colour #FFFFFF is ignored

    I then tried being more specific about the class by adding div. at the beginning which had no effect either.

    In the end the only way to alter it seems to be to make the width of the border colour zero – so not really ideal:
    div.special-heading-inner-border { width: 0; }

    So my question now is how do we OVERRIDE other settings in CSS?

    I would normally find the original CSS file and edit that, but the structure of the template seems to make that frowned upon.

    Sorry to be pedantic, I just need to know the exact way we are meant to make changes to the appearance.

    Thanks.

    September 15, 2014 at 2:51 pm #319216
    Yigit

    Hey!

    Have you tried adding !important rule as following

    .special-heading-inner-border { border-color: #FFFFFF !important; }

    If you are using CSS minifying feature on any plugin, please disable it before applying custom CSS code.
    If you can post the link to your website and point out the element and the changes you would like to make, we can provide you custom CSS code as well

    Best regards,
    Yigit

    September 15, 2014 at 4:14 pm #319269
    ColinWalton

    Brilliant! I had no idea that saying !important; forced it to take precedent.

    You learn something everyday!

    Thanks

    September 15, 2014 at 4:28 pm #319273
    Yigit

    Hey!

    You are welcome, glad we could help :)
    For your information, you can take a look at Enfold documentation here – http://kriesi.at/documentation/enfold/
    And if there are features that you wish Enfold had, you can request them and vote the requested ones here – https://kriesi.at/support/enfold-feature-requests/
    For any other questions or issues, feel free to post them here on the forum and we will gladly try to help you :)

    Regards,
    Yigit

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Where are we meant to edit CSS?’ is closed to new replies.