Mobile Navigation 3 Lines on top of logo in mobile view

Question

Having an issue with the three lines for mobile main navigation being on top of logo (see photo). Google flagged this issue and asked for a fix. I can't seem to find the fix anywhere to make the three lines independent or to the left of the logo location. Please advise. Also, how would one get future updates to the Canvas HTML theme as I thought they were included with the license. Please advise.

SemiColonWeb · Accepted Answer

Hello, 1. You can simply use the following code for the Mobile Devices to make the Logo smaller and have more space for the Mobile Hamburger Icon: 2. Yes, ofcourse! All the Future Updates for Canvas will be provided Free of Charge. Once we release an Update, we will send you a Notification Email. Then you can Download the Updates from your ThemeForest Account's Download Page. Hope this Helps! Let us know if we can help you with anything else or if you find any further issues.

merlft19460 · Answer

Thank you for your reply. This new device code would go on each page in the head section, correct? Any particular area in the head code of the page work best? Okay on the updates answer. Thank you!

Semicolon Web · Answer

Hello,

You will need to add any Custom CSS codes in the css/custom.css File. Additionally, make sure that you have checked out the Documentation > Start > Customization Section for complete details on how to use the css/custom.css File.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

merlft19460 · Answer

Hello, Tried your suggestion. The lines moved over a little bit but are still overlapping the logo on mobile devices. The company logo is the same size as the sample one that you had provided with the template. (The other variations of the logo are also according to the sample sizes provided with t…

Semicolon Web · Answer

Hello,

You appear to be using an Older Version of Canvas which is causing this. Adding the following code should fix this:


.device-xs #logo img,
.device-xxs #logo img {
	height: 64px;
	margin-top: 18px;
	margin-bottom: 18px;
}

Hope this Helps!

Additionally, it is recommended that you update to the Latest Version of Canvas since Older Versions of Canvas is not supported.

Let us know if we can help you with anything else or if you find any further issues.