menu and logo tweaks
-
afternoon,
I wonder if you could help me with some header formatting issues. I’ve checked the snippets as well as anything relevant I could find here but not quite sure and my tries are not working.
Issue is I would like to have the main top menu/nav sit across the width of the content with the divs that would have held the social media, etc be gone and just have a logo in the header sit approximately 25px above the menu. Logo would be approx 700px at full width.
I’ve tried the css fixes posted here re logo width, menu positioning but none are really doing what I need which again, is wide logo on top of wide menu all within the main nav space. I tweaked the class-header-header-main.php but no luck.
I would really appreciate the help.
Site is at http://design.focusdesign.com/blog6/
Thank you
Bob H
-
You’re nearly there. You need to uncheck the “Force logo dimensions to max-width:250px and max-height:100px” checkbox in Customiz’it > Logo & Favicon.
For testing, use a logo of the right width (e.g. http://lorempixel.com/700/100/ ), which will make it easier to see what’s going on.
You need to comment or remove max-width: 250px.
This will then let your logo span across the entire width and as rightly suggested by @electricfeet, you can use image of width 700px and test it after removing max-width: 250px.
Hope this will do the trick for you
Cheers 🙂
morning,
Thank you guys for your help. I’m getting closer with the logo tweak but there still is the issue of space between the logo and the menu.
http://design.focusdesign.com/blog6/
I see using Google developer tools that there is a row and the social-block class is in there. “display: none;” in tools makes it work but it is not when I tweak the child css or the header.php or class-header-header-main.php.
How do I get that space out of there? I suppose I could do a neg bottom margin on the logo div but how do I actually make that space go away?
thanks again very much for your help,
Bob
Add also this:
.navbar .social-block { display: none; }
Thank you…that worked to get rid of that space.
Hate to keep asking for help but I do see where another issue is happening…when I narrow the window the mobile/ipad drop down icon is off to the right and seems to be outside of the main nav div.
The menu appears to be ok but again that mobile drop down icon div is getting pushed off and outside of where it should be. So the media queries seem to be an issue now.
Any suggestions?
Thank you again.
Bob
ok, all set with the menu getting pushed down. I had the width of the .navbar-inner set too wide and it was pushing things around.
But my question remains…how do I get the menu to extend all the way across? I see that it sits in a div but there is also one next to it on the right that I am not sure how to tweak or remove.
Thanks
Bob
Looks like you fixed it…
I also suggest to add this:.navbar-wrapper.clearfix.span12 { margin-left: 0; }
Thank you..
- The topic ‘menu and logo tweaks’ is closed to new replies.