WordPress.com Forums » Topic: [Theme: Hatch] Moving the menu below the header image

designsimply on "[Theme: Hatch] Moving the menu below the header image"

designsimply — Mon, 31 Dec 2012 16:57:00 +0000

How do I move the menu links (Portfolio, About Me, Link) from the top right hand corner to below the header image in the center?

Try adding this to your Appearance → Custom Design → CSS editor:

.blog #masthead hgroup,
.home.page #masthead hgroup {
	margin-bottom: 0;
}

.main-navigation {
	position: absolute;
	text-align: center;
	top: 275px;
	width: 940px;
}

.main-navigation ul {
	float: none;
	display: inline-block;
}

.main-navigation li:first-child a {
	margin-left: 0;
}

Note that it's best to only copy in the CSS rules that you change without copying the entire original stylesheet into the editor. It makes things easier to keep track of and the CSS will be easier to work with that way.

designsimply on "[Theme: Hatch] Moving the menu below the header image"

designsimply — Mon, 31 Dec 2012 16:56:52 +0000

Hello! @castelinokelvin, it looks like you're assuming that anyone with a custom domain name is using a self-hosted WordPress.org setup but that's not the case! A simple way to tell is by looking at the footer. A link back to WordPress.com means it's hosted at WordPress.com even if the domain doesn't say "wordpress.com" in it. :)

castelinokelvin on "[Theme: Hatch] Moving the menu below the header image"

castelinokelvin — Mon, 17 Dec 2012 09:01:10 +0000

Hmm since your blog is self hosted, I suppose you have the access to you code. Are you ready to do some PHP code change or you want achieve this only through CSS, which would be little hard so!

PHP code will be in the Dashboard -> Appearance -> Editor

witapuspita on "[Theme: Hatch] Moving the menu below the header image"

witapuspita — Thu, 29 Nov 2012 03:53:32 +0000

Hello,
I am working on my blog http://witapuspita.com/
Everything looks quite like what I wanted, but how do I move the menu links (Portfolio, About Me, Link) from the top right hand corner to below the header image in the center?
Thanks for your help!