Jump to content


This topic is now archived and is closed to further replies.


Problem with changing the color of NavBar Background

Recommended Posts

rijans    5

To change the color of NavBar, I created a custom class GlobalNavigationBarBGColor in styling classes section. and then added the following code in CSS


.GlobalNavigationBarBGColor {
background-color: #FF6600;
color: #FFF;
But the color is in a frame! Not in the whole background >> http://postimg.org/image/nbmeicx3f/
Is there anything I missed? Site: techgainer.com (the condition is live right now)

.....Being a code noob, I want highest control as much as possible! What a mismatch! ......

.......Feeling Rockstar with DMS! .......

....I believe there's nothing like DMS....

Share this post

Link to post
Share on other sites
batman    389

Hi rijans

I´m not sure but try to add this CSS rule

.navbar.pl-color-base { background: none;}

Life is too short to remove USB safely ...

Share this post

Link to post
Share on other sites
jmad+    80

Or try this link or the code below.





.GlobalNavigationBarBGColor {.section-navbar .pl-section-pad .navbar-content-pad{

padding: 0 15px;

background-color: #ff6600;




And you probably wouldn't need a custom class if you want this through your entire site just use


.section-navbar .pl-section-pad .navbar-content-pad{

padding: 0 15px;

background-color: #ff6600;




Hope that helps.

Share this post

Link to post
Share on other sites

  • Similar Content

    • Grant Turck
      By Grant Turck+
      Navbar Broken on All Devices When Not Logged Into Wordpress. See screenshots attached from mobile. What is causing this issue and how do I fix? Site is venicepride [dot] org.

    • chamois_blanc
      By chamois_blanc+
      It would be nice if all the PL5 shortcodes had a css class option to be able to add classes to the element generated by the shortcode. I'm aware it's usually possible to hack a class in by doing something like size="1x <my_class>". But a clean solution would be nice.
    • PierreFF
      By PierreFF+
      I have an issue with NavPro on mobile when the link of the menue is on the same page. 
      Here is my website: http://foundersofthefuture.co
      The isssue comes from the fact that in my menue most of the items send somewhere else on the same page using anchor link (eg. #container_u788888). 
      This works well on desktop but on mobile, nothing happens when clicking on the link. One of the link of the menue of the homepage "France" sends to another page of the website and this one works well even on mobile. 
      I am using the Pagelines framework theme and also used a wordpress plugin (jQuery Smooth Scroll) for smooth scrolling . 
      Thanks in advance for your help and let me know if I need to provide more information. 
    • nandorj78
      By nandorj78+
      I'd like to request a section (or that this could be enabled on the background settings of the existing sections) in which we could set a image to stay fixed, just as we can see in the link below:
      http://www.bootply.com/render/100702 (you can see 2 different background images and everything scrolls on top of it.)
      Is it possible to be done without having to code it via CSS every time?
    • tristanrodgers
      By tristanrodgers+
      Hi there!
      I'd love to have some social media buttons in my navbar like my online-shop has!
      Can someone explain me how to create them? I tried a lot but don't know how to realize them...
      Greetings from Germany,