How to float main navigation menu to left?

Hello,

You can try this in your Custom CSS for achieving that:

.site-header-menu {
    width: 100%;
}

Hope that helps you, feel free to ask if there is any other problem.

Thank you.

Excellent! So simple…

Thanks.

Welcome. ??

That’s sweet – thanks Sam – been looking for the answer to that for some time.

Hello getalife,

I am glad to hear that. ??

Feel free to ask if you need any other help in future.

Sam, do you know how to change the fonts displayed in the nav menu?

Hello feralie,

Sorry for the late response.

You need to add this CSS in your Custom CSS for better result:

#site-navigation a {
    font-family: arial;
}

You can adjust the font as per your requirement.

Hope that helps.

Thank you.

Awesome! Also, what custom CSS code do i need to make sure that, whatever size i make my browser window, my menu button stays right?

Example- on an iphone the menu button is right aligned
on a IPAD the menu button is LEFT aligned and messes with the alignment of the header

Here are some screen shots of what i am talking about:
https://1b1.087.myftpupload.com/screenshots-for-help/

Hello,

You can try adding this CSS for adjusting that:

@media screen and (max-width: 892px){
.site-header-main {
   text-align: right;
   display: block;
}}

Hope that helps.

Thank you.

Sam,

It works pretty well, but still goes left in the VERY beginning of narrowing the browser window then immediately floats right. Could it be a slight adjustment?

Hello feralie,

Yes you can adjust the value “892px” as per your requirement for better result.

Hope that helps.

Thank you.

Great! i finally got it.

Now i just need to find out how to center everything cause when i narrow down the screen you can see that things get off centered. I think it might have to do with the embedded bandcamp players. Is there any code CSS HTML code to fix that?

Hello,

Add this in your Custom CSS:

@media screen and (max-width: 895px) and (min-width: 692px){
.entry-header, .post-thumbnail, .entry-content, .entry-summary, .entry-footer, .comments-area, .image-navigation, .post-navigation, .page-header, .page-content, .content-bottom-widgets {
    margin-right: 7.6923%;
}}

Hope that helps.

Thank you.

Sam,

It does indeed help! But, there is still ONE point where it goes from laid out nav menu to menu button and things are still off centered like before…but then it quickly changes thanks to your code. What do i need to adjust to make it all good?

oh, i got it!