Center header text

  • Resolved simondevries

    (@simondevries)


    9 years ago

    I have removed the top menu and am now trying to center the header text. I tried

    .site-title {text-align: center;}

    but that doesn’t seem to work. Any help would be really appreciated. Thanks!

    My site is here.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator Kathryn Presner

    (@zoonini)

    The problem right now is that the site title is contained in the element site-branding, which is limited to a 25% max-width, and also floated left, as you can see in the theme’s stylesheet:

    .site-branding {
    border-right: 0 solid #cccccc;
    float: left;
    max-width: 25%;
    padding-right: 30px;
}

    You can try overriding that in your child theme to remove the float and add a wider max-width. For example:

    .site-branding {
  float: none;
  max-width: 1800px;
  text-align: center;
  padding-right: 0;
}

    You’ll want to experiment with it on various screen sizes and adjust the width value as you’d like.

    Thread Starter simondevries

    (@simondevries)

    That works quite well – thank you!

    Moderator Kathryn Presner

    (@zoonini)

    You’re very welcome.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Center header text’ is closed to new replies.