Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #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 http://www.relevantfl.org 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.

    #110484

    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.

    Regards,

    Ismael

    #110485

    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?

    #110486

    Hi!

    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,

    Peter

    #110487

    Now that I am about 75% of the way toward achieving what I want with the header located at http://www.relevanfl.org. 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.

    #110488

    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.

    Regards,

    Devin

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

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