WordPress.org

Ready to get started?Download WordPress

Forums

Change background on a specific widget/menu (7 posts)

  1. glennmil
    Member
    Posted 5 months ago #

    I am using the Picture Perfect Real Estate child theme with the Genesis parent theme. There is a custom menu on the right hand side that should have a white opaque background but instead it has no background at all. Because of this the text is hard to see on the menu. My page is http://www.glennmilgram.com. An example of what it should look like can be found at http://pictureperfect.aethemes.com/. I am not a programmer and this is my first site so if you can give me everything I need to paste into the JetPack Custom CSS Style Sheet editor that would be much appreciated. FYI, I believe the navigation menu I am trying to edit is #nav_menu-3. Thank you! You may want to check this though. Like I said, I am a beginner.

  2. lorbach
    Member
    Posted 5 months ago #

    Hello glennmil. First off, new site looks great. That's a really nice theme.

    I see the white background is working properly on the internal pages. Might be a plugin issue. I'm looking at the CSS now. I'll report back if I can figure it out.

  3. glennmil
    Member
    Posted 5 months ago #

    Thanks lorbach! Much appreciated.

  4. virendra930
    Member
    Posted 5 months ago #

    hi glennmil,
    Just add this css to your custom.css hopefully it'll help you

    .home .sidebar {     background-color: #FFFFFF;}
  5. lorbach
    Member
    Posted 5 months ago #

    Your markup looks very different from the markup in the example site. The example site has a <div class="main"> div with a child div with a class of "home-right". It's that home-right div that gives the white background. But on your page, the element that contains the sidebar is a sibling to the div.main element... it's an "aside" element with a ton of classes applied to it.

    Not sure why there are differences, but I think if you add the class "home-right" to that "aside" element, it will give the translucent white background you’re looking for.

  6. glennmil
    Member
    Posted 5 months ago #

    Thank you Virendra. That worked great. I tweaked it a bit to make it opaque.

    .home .sidebar {
    	background-color: #FFFFFF;
    	opacity: .8;
    }
  7. glennmil
    Member
    Posted 5 months ago #

    I Virendra. I noticed that when I use the code above not only was the menu opaque but so was the black lettering making it a bit difficult to read. I found the below code and it preserved the lettering while still making the white background opaque.

    `.home .sidebar {
    background-color: rgba(255,255,255,.7);
    }`

Reply

You must log in to post.

About this Topic