Hemingway Rewritten – Centering the Nav Menu

lehmanz · Member · May 17, 2014 at 10:08 am
Copy link

Add topic to favorites
Hi guys,

I’m trying to figure out how to center the menu that’s below the header image. It seems to stay off to the left (I’ve removed the sidebar and widened the content to full width).

colorfultones · Member · May 18, 2014 at 1:39 am

Try this:

.main-navigation ul {
    text-align: center;
}
.main-navigation li {
    display: inline-block;
}

That should do it.

lehmanz · Member · May 18, 2014 at 1:51 am
Copy link
hmm, I added that to the bottom of the CSS and it didn’t change anything. Any thoughts?
colorfultones · Member · May 18, 2014 at 1:55 am
Copy link
Can you please post link to your site?

colorfultones · Member · May 18, 2014 at 1:57 am

Sorry, but please replace with the following:

.main-navigation ul {
    text-align: center;
}
.main-navigation li {
    display: inline-block;
    float: none;
}

lehmanz · Member · May 18, 2014 at 3:29 am
Copy link
That worked perfectly! Thanks :)

Nice ‘stache, btw.
colorfultones · Member · May 18, 2014 at 6:03 pm
Copy link
Thanks! : {
gabriellprinsloo · Member · May 23, 2014 at 11:51 am
Copy link
Hi

This is excellent – thank you! Exactly one of my questions and works perfectly.

I have 2 more questions related to the font size. I am a wordpress newby, so sorry if they are doff. I cant seem to find the answers anywhere.

I would like to change the font size of the navigation menu and page title (entry header) each individually.

I have adjusted the font using the fonts option in the Custom design, however the text is grouped, so when one section is the right size, the other is too big.

I am using Hemingway rewritten and it’s for philosperformance.com

Thanks! :-)
thesacredpath · Member · May 24, 2014 at 10:38 pm
Copy link
Since you are using custom fonts, we have to use a slightly different selector to adjust the size of the fonts. Add the following CSS and adjust as desired for the navigation.
```
.wf-active .main-navigation a {
    font-size: 11px;
}
```
If you are wanting to adjust the entry titles in the content area (such as Philos) add the following and adjust as desired.
```
.wf-active .entry-title {
    font-size: 42px;
}
```
gabriellprinsloo · Member · May 25, 2014 at 9:22 am
Copy link
Fantastic! Thanks so much! :-)
paulbarbaro · Member · May 28, 2014 at 3:56 pm
Copy link
Hi there,
I’m also looking to centre the menu titles below the header image; where should I be posting the css code – appearance > edit css and just copy the code into there? It’s not working for me. Thanks.
colorfultones · Member · May 28, 2014 at 6:25 pm
Copy link
@phatpaolo this should work:
```
.main-navigation ul {
text-align: center;
}
.main-navigation li {
display: inline-block;
float: none;
}
```
Please let us know if it does not.
paulbarbaro · Member · May 28, 2014 at 7:28 pm
Copy link
No, I copied it in to my CSS Stylesheet Editor but it’s still left aligned. Any other suggestions?
colorfultones · Member · May 28, 2014 at 7:33 pm
Copy link
Do you have a WP.com or WP.org site? Please post link to your site.
paulbarbaro · Member · May 28, 2014 at 7:35 pm
Copy link
wp.com http://letourdeslackline.com/
colorfultones · Member · May 28, 2014 at 10:48 pm
Copy link
@phatpaolo, I think you’re using the Hemingway theme and not Hemingway Rewritten.

Either way there seems to be a whole slew of different CSS classes to target. Try this:
```
ul.blog-menu {
    text-align: center;
}
ul.blog-menu > li {
    float: none;
    display: inline-block;
}
```
paulbarbaro · Member · May 29, 2014 at 6:34 am
Copy link
Genius, that’s done the trick, thanks @colorfultones. What makes you think I have the original version of Hemingway? Anything worth doing to make my life easier?
paulbarbaro · Member · May 29, 2014 at 7:39 am
Copy link
Sooo @colorfultones, you were right, for whatever reason I had the original Hemingway theme in place. I have since reinstalled the rewritten and placed the original

.main-navigation ul {
text-align: center;
}
.main-navigation li {
display: inline-block;
}

and it works fine. Thanks a bunch.
colorfultones · Member · May 29, 2014 at 6:11 pm
Copy link
No problem, and glad to help.