Plugin interferes with custom css

  • Resolved Hugues

    (@hugaud)


    8 years, 2 months ago

    Hi,
    I’ve installed the plugin and assigned a template to replace the footer of my site (BB theme and BB pro page builder). It seems to interfere with my custom CSS though: the padding added to heading is no longer applied (the background colour is fine though)

    /* background for heading titles on homepage */

    .bg-headinghome .fl-heading {
    background: #373a2d;
    padding: 10px !important;
    }

    Just having the plugin installed is fine but as soon as I assign a template to replace the site footer this css is affected.

    Any ideas what is going on ?

    Thanks in advance

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author Nikhil Chavan

    (@nikschavan)

    8 years, 2 months ago

    Hey @hugaud,

    Is there any page URL where I can see this issue? This will help me identify the exact CSS that is overriding your custom CSS?

    Thread Starter Hugues

    (@hugaud)

    8 years, 1 month ago

    Hi Nikhil,

    Here is the url of the site – in development https://e-ha.co.uk/lbblinds/

    NB: you’ll see two footers one is added by your plugin, the other is a global BB row I am using instead for now

    I’m also attaching a screen shot of what those titles above images should look like – with the footer set back to “theme footer” i.e. with padding:

    View post on imgur.com

    And how it looks when I use a BB temlate via your plugin as the footer

    View post on imgur.com

    I hope this makes sense. let me know what you think
    Hugues

    Thread Starter Hugues

    (@hugaud)

    8 years, 1 month ago

    Hey Nikhil,
    Have you had a chance to look at this please ?

    I’ll need to revert to the proper layout – so deactivate and delete the plugin – soon so if you are able to look then great. if not, no worries i’ll find another solution.

    Cheers
    Hugues

    Plugin Author Nikhil Chavan

    (@nikschavan)

    8 years, 1 month ago

    Hello Hugues,

    I am sorry, I missed your last message.

    The problem here is, you have set margin and padding 0px for headings for the footer template and as that template is being loaded after the main page template it’s stylesheet is loaded after the main page’s stylesheet. So that is overriding the Custom CSS that you have written.

    What you can do is, add this CSS in the page level custom CSS for the footer. That will make sure that it is loaded later in the page.

    .bg-headinghome .fl-heading {
    background: #373a2d;
    padding: 10px !important;
    }

    Thread Starter Hugues

    (@hugaud)

    8 years, 1 month ago

    Brilliant thank you, that works !

    I had !important but in the css for the headings themselves not in the footer page css, I hadn’t realise I needed to account for the cascade in this way and would never have guessed it without you…

    I’m using this alongside UABB, a great plugin to extend Beaver Builder.

    Cheers
    HUgues

    Plugin Author Nikhil Chavan

    (@nikschavan)

    8 years, 1 month ago

    I am glad I could help 🙂

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Plugin interferes with custom css’ is closed to new replies.