It seems the trend is to put the company logo or brand in the navbar with Bootstrap 3, but I need to have it below the navbar and centered on the page but have it responsive as well.
The project is to convert an existing WordPress website into a completely static website using Bootstrap 3 framework. Things are going to be a little different with the static site. One of the things that I noticed works better is to have the navbar to the right so when resizing the browser, the nav links don’t see to break. That is cool and I will explain that to the client (who doesn’t really care about the site being responsive yet views it all the time on his iPad!).
What I did was create a page header which has the nav and the logo in it. For the logo I created another container. The image link is in the HTML, not the CSS. I don’t know if that is best practice or not. That is the way it is on the WP site.
What is the best way to get the logo centered and just under the top nav? I thought maybe the Jumbotron was a way to do it with transparent background and the logo centered that way. I have not used Bootstrap before, so this is all new to me using this framework.
The logo has 2 sizes - 500x100 and 300x60.
Yes the 300x60 does fit in the navbar but the client wants it where the logo is on the WP site.