We build. You grow.

Get best community software here

Start a social network, a fan-site, an education project with oxwall - free opensource community software

Simplicity Banner | Forum

Topic location: Forum home » Development » Themes
John H
John H Jan 10 '16
How can I use my own banner that is 220 pixels in height instead of the one in there that is 521 pixels?  I tried uploading the new one using the admin panel, but all the site did was make it bigger to fill in the height the old one was.


Thank you for any help.

Darryl B Leader
Darryl B Jan 10 '16
The .ow_header_pic css has the settings below. The image they used was 521px in height, but the css sized it to 300px

.ow_header_pic {
    background-size:cover; "This fills the image across the page"
    height: 300px; "This sets the height of the image"
}

You will need to add this to your themes custom css in the admin panel. It should maintain the height of you image.

.ow_header_pic {
    height: 220px;
}
John H
John H Jan 10 '16

Quote from Darryl B The .ow_header_pic css has the settings below. The image they used was 521px in height, but the css sized it to 300px

.ow_header_pic {
    background-size:cover; "This fills the image across the page"
    height: 300px; "This sets the height of the image"
}

You will need to add this to your themes custom css in the admin panel. It should maintain the height of you image.

.ow_header_pic {
    height: 220px;
}
Oh my gosh, it works perfect now.  Thank you very much :-)
Brian
Brian Feb 14 '16
Thanks Darryl for that quick and simple fix!


I was wondering what CSS modifications are needed to make the banner image always fit the screen, even if you go to I-phone 5 size. After a certain size the image will no longer shrink and depending on how small you go the banner disappears on the left and right side.

Darryl B Leader
Darryl B Feb 15 '16
You can try this. If there is a pixel width setting. the image will be no smaller than that.

.ow_header_img {

    width: 100%;

}


The Forum post is edited by Darryl B Feb 15 '16