WordPress.com is an easy way to start blogging. Get a blog, check out our features, read the latest announcements, choose from great themes, or learn about the team behind it.
Need help? Check out our Support site, then
It may be hard to tell, but the text in my nav bar above the header is off-centered. The only reason it almost looks centered is because I have it filled with links, but I would like to center it so I could remove some of those. I've tried to obvious things in my CSS, but for whatever reason, I can't figure it out. Suggestions?
The blog I need help with is thesmartcookiecook.com.
This will do it, but there are disclaimers: It blows up if the menu system goes to a second line (goes back to float left).
thesmartcookiecook
#wrapper {
overflow: hidden;
}
#nav ul {
float: left;
left: 50%;
position: relative;
}
#nav ul li {
position: relative;
right: 50%;
}Also do this to split the padding on left and right of the menu items so it looks more centered.
#nav li a {
padding-left: 7px;
padding-right: 7px;
}That's okay because I don't want two lines. So if I get rid of a link or two in the nav this will still be centered?
Try this:
designsimply#nav ul {
display: inline-block; margin: 2px auto;
}Make sure to test it in a few different browsers.
Try to remove some of the other unnecessary CSS you added before like "float: center" to take a way some clutter.
Yup.
I should've refreshed. :)
Yours is much less complex than mine.
Use @designsimply's solution.
Okay, thank you both!
Okay, now my drop-down menus in the nav bar are cut off.
I'm not seeing anything cut off. All the dropdowns appear complete to me.
Oh, I see. Remove the "overflow: hidden;" from #wrapper.
Try scrolling down to one of the menus that branches off. If you go to "recipes and more" then recipes, the next menu that comes up is cut off on the right.
Ah thank you!
You are welcome.
This topic has been closed to new replies.
