Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • #21111

    Is there a way to make the image/logo from the header span the entire height of the header area? For example, on my website that is using your theme, the picture of the pastors next to the logo is in line with the church logo (one image). I would like to set it so that the height of the image could be increase to go to the bottom of header area and possible all the way to the top of the header area.


    Hi jmwilliams83,

    Try to add this code in your Quick CSS (located in Incarnation > Theme Options > Styling) or custom.css:

    div .logo {
    padding: 0 !important;

    Hope this helps.




    Awesome that worked!!!!

    Is there a way to remove the padding from the width in the logo so that it goes all the way to the left corner instead of having that ~1″ of padding?



    You can use following css code:

    .boxed #menu_container.container {
    margin: 0 !important;

    Add it to css/custom.css or into the quick css field.

    Best regards,



    Now that I am about 75% of the way toward achieving what I want with the header located at How do I go about keeping the Menu from overlapping the church logo as you resize the browser window to simulate the responsive effect for various devices? Also, The bottom line of the graphic, how do I get it to extend all the way to the end of that top section and not end just after the menu option “Members”? I have made the width of the header image 1450px but that doesnt seem to have had any effect.


    Hi jmwilliams83,

    You’ll need to use media queries and add css rules for each screen size so that it adjusts as you resize. Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:

    /* #Media Queries
    ================================================== */

    /* Smaller than standard 960 (devices and browsers) */
    @media only screen and (max-width: 959px) {


    /* Tablet Portrait size to standard 960 (devices and browsers) */
    @media only screen and (min-width: 768px) and (max-width: 959px) {


    /* All Mobile Sizes (devices and browser) */
    @media only screen and (max-width: 767px) {
    /*your general mobile css changes can go here */

    /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
    @media only screen and (min-width: 480px) and (max-width: 767px) {


    /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
    @media only screen and (max-width: 479px) {


    It’ll take a bit of experimentation to get it exactly as you’d like but this is how the theme resizes all of its elements so you can adjust your custom changes as it adjusts as well.



Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘Header Image Height’ is closed to new replies.