Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress

Posted by Michael Robertson
Michael Robertson
6,160 Points

Centering a Logo with the nav bar wrapped..

Hello, I am trying to center the logo of my website and I want it to be directly in the center of the of the menu.. So i will need to center align the logo and navigation menu..

I think that I would use list items for the nav menu.. The problem is also I cant determine the id that controls logo. I have used developer tools and tried to center the logo using css without avail.. Development website is www.dev.robertsonwebdesigns.com

Thanks

4 Answers

Andreas Anastasiades
Andreas Anastasiades
2,916 Points
Andreas Anastasiades
Andreas Anastasiades
2,916 Points

Aah I see, you want to have 3 links left, logo, 3 links right? correct?

Achieving this might be a bit harder, unless you create 2 navigations, let's say main-left and main-right Add theme functionality and place the logo in te middle of both navs

Andreas Anastasiades
Andreas Anastasiades
2,916 Points
Andreas Anastasiades
Andreas Anastasiades
2,916 Points

Hi Michael,

Logo looks centered to me? Did you already fix it? Only comment I can give you is;

@media only screen and (max-width: 760px)
.logo img {
  max-width: 100%;
  height: auto;
}

Don't use max-width: 350px, your logo doesn't look centered here, it overflows your div since it's not wide enough. Using 100% will keep your logo inside your dive and centered on your site.

Michael Robertson
Michael Robertson
6,160 Points
Michael Robertson
Michael Robertson
6,160 Points

Thanks Andreas!

Still trying to figure-out how to drop the logo down into the center of the nav menu. I think I am going to have to modify the logo and remove the words masterflo plumbing, leaving just the water drop to achieve the right look and feel. Then I think I would take the original logo back to the left side of the header..

Thanks

Michael Robertson
Michael Robertson
6,160 Points
Michael Robertson
Michael Robertson
6,160 Points

Thanks Andreas!

Thats what I was thinking...

I posted another question in the CSS forum. Would you take a look? You seem to know what you are talking about!!

Thanks for your assistance! Mike