Help Please! Moving Navigation below Header

jessicabalsley · Member · Jan 22, 2011 at 8:39 pm
Copy link

Add topic to favorites
I’m trying to move my navigation bar below my header, but am a real know-nothing when it comes to CSS! Please help!
http://theartofeducation.wordpress.com

The blog I need help with is: (visible only to logged in users)
timethief · Member · Jan 22, 2011 at 9:15 pm
Copy link
Oh, oh this upgrade has no official Staff support and only two volunteers help with it when they can. That’s why we don’t recommend it to those who don’t have a moderate understanding of HTML and CSS and how they work. Please be patient and consult tutorials found here > http://en.support.wordpress.com/custom-css/#css-help while waiting for a Volunteer to help you. :)
jessicabalsley · Member · Jan 22, 2011 at 9:18 pm
Copy link
Ok, thank you for the help. Can you please explain to me what you mean by ‘this upgrade’? Do I need to upgrade my wordpress version or something like that?
thesacredpath · Member · Jan 22, 2011 at 9:20 pm
Copy link
To edit the CSS you have to buy the CSS upgrade. That is the upgrade TT was talking about.
jessicabalsley · Member · Jan 22, 2011 at 9:21 pm
Copy link
Oh, thanks! I actually do have the CSS upgrade. I’ve made several changes to the CSS on the site. But I can’t figure this one out. I can’t get the header to go above the navigation…
panaghiotisadam · Member · Jan 22, 2011 at 9:26 pm
Copy link
Rich, help here please:
https://en.forums.wordpress.com/topic/editing-freshy-theme-help?replies=11
thesacredpath · Member · Jan 22, 2011 at 9:30 pm
Copy link
This will get you started. You will have to adjust a number of other things as well. I tossed in a float left for the navigation since it looks funny between the header and content floated right.
```
#pagenav {
position: relative;
top: 220px;
}

.fr {
float: left;
}
```
jessicabalsley · Member · Jan 22, 2011 at 9:37 pm
Copy link
thesacredpath, thank you so much! that look 1 million times better! The only problem now is that the header is a bit to low… everything on the page needs to go up quite a bit so there isn’t so much negative space at the top… could you help with that as well!?!
thesacredpath · Member · Jan 22, 2011 at 10:05 pm
Copy link
This might not be the best way to do it, but it seems to work. Make sure and check all the other pages and check some category pages as well.
```
#header, #content {
position: relative;
top: -120px;
}
```
jessicabalsley · Member · Jan 22, 2011 at 10:08 pm
Copy link
Wow, you are so helpful! That worked perfectly… now, I only had one more thing I wanted to fix today, I’ll ask it here (since you’ve been so amazing) but I an also just create a new thread if needed….

I want to make the header clickable so it will link to the main page. I’d prefer it that way but alternatively, one of the main navigation tabs could just be ‘Home’… but I don’t know how to do it either way.

Thank you so much for your help! You’ve made all the difference in the world.
thesacredpath · Member · Jan 22, 2011 at 10:13 pm
Copy link
Go back to settings > general and enter the blog title there and save and let me know when you have done that and I’ll adjust things so the title is invisible, but overlayed on the image so it is clickable.
jessicabalsley · Member · Jan 22, 2011 at 10:19 pm
Copy link
Done! ;)
thesacredpath · Member · Jan 22, 2011 at 10:32 pm
Copy link
Give this a try. It doesn’t cover the entire new header/logo area, but nearly all of it.
```
.site-title a:link, .site-title a:visited {
color: transparent;
left: 100px;
position: relative;
top: 200px;
}
```
jessicabalsley · Member · Jan 22, 2011 at 10:52 pm
Copy link
The linking seems to work but the title is not transparent. Do I need to post this code somewhere specific in the CSS or is something else wrong?
jessicabalsley · Member · Jan 22, 2011 at 10:53 pm
Copy link
Nevermind – Now it’s working! Thanks so much, thesacredpath! Your help is much appreciated!
thesacredpath · Member · Jan 22, 2011 at 10:55 pm
Copy link
You are welcome.

No items found.