Changing header size in Coraline

  • Resolved philopolis

    (@philopolis)


    11 years, 5 months ago

    Hi,

    I’ve made my site wider to accommodate more navigation buttons, but I’ve got a problem with my header. Firstly, I want to make the border lines wider to fit the new site size, and secondly I want to centre my header image. I’ve been looking through these forums but can’t find how to do this (although I have found that I should probably be using a child theme, urgh).

    Any help would be really appreciated! My site’s at http://www.writerightnow.co.uk if you want to see what I mean.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Arthur Broeders

    (@thrbr)

    11 years, 5 months ago

    Hi philopolis,

    That is a very nice site!

    These border lines are part of the header image styling (3px at the top, 1px at the bottom, 0px left and right):

    #branding img {
	border: 1px solid #000;
	border-width: 3px 0 1px;
	max-width: 100%;
	height: auto;
}

    You have made the site wider, but the header image width still is 720px.
    So you should resize the image according to the page width.

    Or a fast method: give the header image a width=”100%” (and height=””). So it stretches to fill the header. And thus the borders are fitting as well.

    <img src="./../writerightnow.png" align="center" width="100%" height="" alt="">

    But better resize the image.
    And as you can see the image is defined max-width: 100%, so if you match the width (if you are not exactly sure, just make the image a bit wider than the page!!!), and add/upload the header image again, that is the only thing there is to it. No child theme needed 🙂

    Hope this helps.

    Kind regards,

    Arthur

    Thread Starter philopolis

    (@philopolis)

    11 years, 5 months ago

    Thanks for such a quick reply, and for the compliment! That’s excellent, I did just adjust the header image size in the functions to do it, which doesn’t really skew the image so it’s a fine solution without having to resize the actual image.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Changing header size in Coraline’ is closed to new replies.