[Resolved] sidebar background colour/container issue

Home Forums Support [Resolved] sidebar background colour/container issue

Home Forums Support sidebar background colour/container issue

Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • #685709
    Elisabeth

    Hi all
    I think this is an easy one but I can’t work it out quite right. Also can’t seem to hit the exact key words I need in the forum or documentation when I search. So…
    I’ve got a website where the sidebar is on the left and has a couple of widgets in it. On the right is the content. At the bottom is the footer, obviously.

    On some pages there is a lot of content. When the content in the main body area makes the page very long the background colour of the sidebar just stops below the last widget (this isn’t a problem on pages with less content as the widgets take the sidebar all the way down to the footer anyway. I want the whole sidebar to have a background colour, not just individuals widgets.

    I’m going something wrong in how I’m setting up elements or page layout in the customizer. Suggestions?!
    Elisabeth

    #686045
    Leo
    Staff
    Customer Support

    Hi there,

    Any chance you can link us to the site in question so we can provide the best solution possible?

    You can edit the original topic and use the private URL field.

    Let me know 🙂

    #686657
    Elisabeth

    I’ll add the link to the private url section in the original query, with the proviso that this is my messing around sandpit!
    I’ve added a tonne or lorem ipsum to show what happens when the text in the body/content area runs further down the page than the sidebar widgets go.

    #686660
    Elisabeth

    If you click around the site in the private url I sent over you’ll see that on pages where the body content goes less far down the page the sidebar background colour goes right down to the top of the background colour of the footer.

    #686681
    David
    Staff
    Customer Support

    Hi there,

    you can try this CSS:

    @media (min-width: 768px) {
        .left-sidebar #content {
            display: flex;
        }
        #left-sidebar {
            background-color: beige;
        }
    }

    Then remove the customizer color for the sidebar widgets

    #686751
    Elisabeth

    sorry to be really thick – does this go in the element or in the Customizer ‘extra css’ bit?

    #686752
    David
    Staff
    Customer Support

    In the Customizer CSS 🙂

    #686758
    Elisabeth

    thank you!

    #686760
    David
    Staff
    Customer Support
    #686765
    Elisabeth

    Hmmm… that’s now giving me a white background where widgets appear in the sidebar, and a beige one below that… have tried the second bit of code you sent over.

    #686773
    David
    Staff
    Customer Support

    So in the Customizer > Colors > Side Bar Widgets on the background color there is a second slider just pull that down to the bottom to remove the white

    #686777
    Elisabeth

    Aha. Magic! Thank you.
    And I presume I just change the ‘beige’ to the exact hex code for the colour I want in that CSS above to get the background to what I want it to be.

    Thanks so much!

    #686778
    David
    Staff
    Customer Support

    Thats correct 🙂 Glad to be of help

    #686878
    Elisabeth

    I’m loving GeneratePress… as far as I’m concerned it’s the perfect gateway drug to learning/teaching yourself/trying out html and css. Lots of stuff is already done for you, but it’s very flexible, and you can tweak and add and experiment. Really appreciate the support forum, also.

    #686884
    David
    Staff
    Customer Support

    Wow, really appreciate the feedback.
    Tom does a cracking job at keeping the Theme lightweight and flexible.
    And we like nothing more then helping people achieve their designs 🙂

Viewing 15 posts - 1 through 15 (of 15 total)
  • You must be logged in to reply to this topic.