Jump to content


Photo
- - - - -

How do I get away from the gray part of an active page


  • Please log in to reply
8 replies to this topic

#1 sbertschinger

sbertschinger

    Newbie

  • Members
  • 5 posts
  • Framework Version:V2.3.2

Posted 09 October 2012 - 09:48 AM

After hours of trying and searching through the forum, I have to ask here:

How do I get away from the gray part of an active page?

Here my CSS code:


#navbar {
float: left;
width:100% !important;
position: relative;
}

#navbar ul {
clear: left;
float: left;
list-style: none;
margin: 0;
padding:0;
position: relative;
left: 50%;
text-align: center;
width: auto !important;
}

#navbar ul li {
display: block;
float: left;
list-style: none;
margin: 0;
padding: 0;
position: relative;
right: 50%;
}

.navbar {
background: url(

Please Login or Register to see this Hidden Content

) !important;
background-repeat: no-repeat !important;
box-shadow: none;
float: none !important;
}

.navbar.navbar-content-width {
border-radius: 0px 0px 0px 0px;
}

.navbar.pl-color-black-trans {
background-color: none;
border-top: none;
}

.navbar .navline > li > a {
font-family: Abel;
color: #0091CB;
font-size: 17px;
text-transform: lowercase;
display: block;
float: center;
padding: 10px 15px 10px 15px;
text-decoration: none;
}

.navbar .navline > li > a:hover, a:active {
text-decoration: none;
color: #000000;
padding: 10px 15px 10px 15px;
}

If a page is active it should be without this grey part and the font should be black. Any help? Thanks!!

#2 Danny

Danny

    Is Awesome!

  • Moderators
  • 15680 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 09 October 2012 - 10:36 AM

Hi,

Can you provide a link to the site in question please or a screenshot of the issue.

#3 sbertschinger

sbertschinger

    Newbie

  • Members
  • 5 posts
  • Framework Version:V2.3.2

Posted 09 October 2012 - 11:14 AM

Sorry, here we go:

Please Login or Register to see this Hidden Content


Please Login or Register to see this Hidden Content



#4 Danny

Danny

    Is Awesome!

  • Moderators
  • 15680 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 09 October 2012 - 11:28 AM

OK, what you can do is use the :active pseudo class and then apply apply background-color: transparent to it.

If you can provide a link, or tell us which Navigation section you're using for you menu, we will be able to assist further.

#5 sbertschinger

sbertschinger

    Newbie

  • Members
  • 5 posts
  • Framework Version:V2.3.2

Posted 09 October 2012 - 11:43 AM

Here is the link:

Please Login or Register to see this Hidden Content



Using: NavBar

Thanks for help.

#6 sbertschinger

sbertschinger

    Newbie

  • Members
  • 5 posts
  • Framework Version:V2.3.2

Posted 09 October 2012 - 12:54 PM

I was checking with Firebug. In my opinion i should tell the following class to be white with black font color:


.menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-15 current_page_item menu-item-223 {
backgorund-color:#FFFFFF;
color: #000000;
}

But its not working. I suppose I think because troubleshooting too complicated....

#7 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 09 October 2012 - 02:42 PM

Your selector is in correct. Are you trying to change the individual menu item?

#8 sbertschinger

sbertschinger

    Newbie

  • Members
  • 5 posts
  • Framework Version:V2.3.2

Posted 09 October 2012 - 03:03 PM

Actually I just want to change the menu so that when a page in the menu above is active (choosen), this gray part is off (or transparant) and the font is black.
Sorry after hours searching the error i am getting lost :-)

#9 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 09 October 2012 - 03:28 PM

You'll need to use a selector like this:

Please Login or Register to see this Hidden Content


It'll require adjustments and playing around if it doesn't work the first time.