How do I make the sidebar background colour stretch to the bottom of the page?

  • Hi,

    I’m using buddypress plug-in with the magazine theme, I want to make the sidebar background colour stretch the full length of the page, from the bottom of the navbar to the footer. I cannot figure out how to do this in the .css?

    The .css currently says:

    #header-search-section, #sidebar{
        float: right;
        width: 320px;
        padding-right: 20px;
        padding-left: 10px;
        background-color: #e4f4fa;
}

    I have tried ‘repeat: y’ and ‘height: 100%’ but neither are any good.

    Can anybody guide me? Also a 1px border might look good. Thanks!

    My site is https://4.biz/

Viewing 1 replies (of 1 total)
  • Thread Starter dan_85

    (@dan_85)

    I have worked it out – for anybody wanting to know how to do it it is simple really, you make an image about 5px high of just the solid colour you want your sidebar to be, then save it in your ftp.

    Then find the appropriate line of .css – I use Mozilla’s Firebug tool to do this.

    Then enter the following line of code:

    background: #fff url(enter the URL of the image you have just saved in here) repeat-y top right;

    Just to note, the top right bit of code is if you want your sidebar on the right of the page. I am not sure but would guess if you wanted it on the left you would enter top left.

    I am a novice – so I have tried to describe that as best I can for any other novices trying to make their sidebar colour stretch the full height of the page!!

Viewing 1 replies (of 1 total)
  • The topic ‘How do I make the sidebar background colour stretch to the bottom of the page?’ is closed to new replies.