Jump to content


Photo
- - - - -

Problem with changing the color of NavBar Background

navbar background class

Best Answer Aires , 07 March 2014 - 12:11 AM

Hi, 

Read this  http://forum.pagelin...lor/?hl=navbar 

 

Hope this helps.

Go to the full post


  • Please log in to reply
3 replies to this topic

#1 rijans

rijans

    Super Member

  • Members
  • PipPipPipPip
  • 170 posts
  • LocationDhaka, Bangladesh
  • Framework Version:DMS 2.x
  • Country: Country Flag

Posted 06 March 2014 - 08:38 PM

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)

Edited by rijans, 06 March 2014 - 08:40 PM.


#2 batman

batman

    Bat Learning

  • Members

  • 2219 posts
  • LocationBuenos Aires, Argentina
  • Framework Version:DMS
  • Country: Country Flag

Posted 06 March 2014 - 10:20 PM

Hi @rijans

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

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


#3 Aires

Aires

    Advocate

  • Members

  • 362 posts
  • LocationAlabama
  • Framework Version:DMS2
  • Country: Country Flag

Posted 07 March 2014 - 12:11 AM   Best Answer

Hi, 

Read this  http://forum.pagelin...lor/?hl=navbar 

 

Hope this helps.


  • rijans likes this

#4 jmad

jmad

    Advocate

  • Members

  • 978 posts
  • LocationCentral Florida
  • Framework Version:DMS
  • Country: Country Flag

Posted 07 March 2014 - 12:46 AM

Or try this link or the code below.

 

 

http://forum.pagelin...ixed-centering/

 

.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.







Also tagged with one or more of these keywords: navbar, background, class