Can't change size of custom header

  • Author
  • #2925467

    Trying to decrease the size of the custom header on the Lodestar theme. It is absolutely massive on Desktop and super small on mobile. I want to be able to see the image well, but don’t necessarily need it to take up half the desktop page, and on mobile i can barely see it. Why is there such a large discrepancy?

    The blog I need help with is


    Have since had success with:

    .custom-header .custom-header-image { height: 200px; }

    However, I cannot go below a certain point, and I would like to restrict this further on desktop. Also, cannot get a media query to work for mobile, although the size with this current CSS is not horrible.


    Hi there, change your height to max-height like this

    .custom-header .custom-header-image {

    and then add the following also, and you can adjust the 5% value I’ve given as an example as desired.

    @media screen and (min-width: 30em) {
    	.custom-header-image {
    		padding: 5%;


    Much better, thank you!


    You are welcome.

The topic ‘Can't change size of custom header’ is closed to new replies.