Centering navigation on Blog template on mobile only?

You'll want to amend your template's CSS file and add a set of conditional rules to center the header when the viewport size is small, e.g.

@media screen and (max-width: 600px) {
        ...
}

Those rules will vary depending on the specifics of what you're trying to accomplish but happy to answer any questions you have

Thank you. I've tried (and failed) to get the elements of the blog title, Pages and the search/RSS icons to center using the placeholder sections you have at the bottom of the Blog template that referend the @media code. Any tips for what I'm doing wrong with just this simple example for the blog title/#logo may point me in the right direction. This CSS seems to have no bearing on that element at any screen size I've tested with (including just collapsing the browser window to a more narrow width and mobile devices).

@media screen and (max-width: 600px) {

#logo {
      display: block;
    width: 100%;
      margin: 0;
      align-content: center !important;
}
  .main, .margin {width: 100%;}
  .wide {width: 100vw;margin-left: -2rem;margin-right: -2rem}
  .wide.right {margin-left: 0;margin-right: 0;width:100%;}
  .margin {left: auto;position: relative;padding-left: 0}

}

Have you checked using the developer tools on your web browser whether the CSS you have added is applying to the elements you are trying to center?