WordPress.org

Ready to get started?Download WordPress

Forums

Coraline
[resolved] Help changing header size on Coraline (10 posts)

  1. actinam
    Member
    Posted 1 year ago #

    Hello,
    I would like to change the height of the header.
    Its current; at 150 px and that's too thick.
    I have tried going under stylesheet.css, I have also tried editing it from my files under my hosting account without success.
    Please help.

  2. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    Does that theme come with a Custom CSS option in the dashboard?

  3. actinam
    Member
    Posted 1 year ago #

    Andrew, Thank you for your response.
    Under my dashboard in the left drop-down column it gives me an option for editing the theme.
    The options are:
    Stylesheet
    (style.css)
    Visual Editor RTL Stylesheet
    (editor-style-rtl.css)
    Visual Editor Stylesheet
    (editor-style.css)
    RTL Stylesheet
    (rtl.css)

  4. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    Can you provide a link to the webpage with the 150px header and state which size you want it?

  5. actinam
    Member
    Posted 1 year ago #

    Sure its:
    Spoken Affirmations

    I would like the header to be about 120 or 130

  6. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    Sorry, I can't find the 150px-tall header. Which bit is it?

  7. J
    Member
    Posted 1 year ago #

    Hi,

    Im assuming it's the main header image you are talking about? If so this is been styled in your main style.css .

    As follows on line 426 is where you need to edit the height :

    #branding img {
        border: 0 solid #000000;
        height: 130px;
        max-width: 100%;
    }

    Just change the height too whatever you desire as you can see its already set too 130px nothing in the header is set to 150px at the moment, which is where the confusion is coming in.

    Cheers
    J

  8. Andrew Nevins
    Barrel Rider, Spam Zapper & Volunteer Moderator
    Posted 1 year ago #

    I disagree with editing the theme's files. Modifications to the theme's files will erase when the theme updates.

    Download (and install) a Custom CSS plugin and place CSS modifications within the section allocated in the dashboard by that plugin.

    So, you'd want something like;

    #branding img {
     height: 100px;
    }
  9. actinam
    Member
    Posted 1 year ago #

    Okay I changed the following:
    #branding img {
    border: 0 solid #000000;
    height: 130px;
    max-width: 100%;
    }

    However, even though it thinned out the width, It expanded my banner to make the words & logo look smushed.

  10. J
    Member
    Posted 1 year ago #

    Sorry Andrew missed that bit thanks :).

    Follow Andrews instructions on the custom CSS side as if you update the theme in the future these changes will be overwritten.

    Regards the image sizing it is forcing it to go a smaller height. The other way to do it would be to change the container size #branding but this would cut abit off the bottom of your image. As follows :

    #branding {
        height: 135px;
        overflow: hidden;
        width: 100%;
    }

    This may solve the issue for you.

    Hope this helps

    J

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic