Need help with small details and bugs?

4 replies · opened Feb 12, 2020

SSoBuenoFeb 12, 2020

Hello Canvas Team,

I am almost finished with my new Canvas themed site but I am still having a couple of issues.

Here is the website link. http://www.cultbranding.com/test/index.html

  1. Header responsiveness. When screen size is about 1189 x 1412 the logo background turns white, from transparent and jumps up to its own line. As the screen gets smaller it finally jumps into the mobile header. This happened after I added a fifth menu option in the header “Blog” between the “About” section and the “schedule a call” CTA button. It was working fine with only 4 header options before but I need the 5th and possibly more menu options in the future too.

  2. On mobile, if you turn the phone to landscape, the text on the parallax header image is half covered by the menu bar, the text gets cut off by the menu bar. And, the schedule a call CTA button in the header parallax isn’t showing up. Here is a link to a video showing the error on our mobile device. https://youtu.be/3ouMtiFOk54

  3. We are having an issue when the browser screen is really narrow. The header parallax text merges right into the menu bar. I added an image showing the error.

Thanks for your help. I really appreciate all the support.

SSoBuenoFeb 12, 2020

Sorry, Here is the image attached. Had to compress the image.

SSemicolon WebSTAFFFeb 13, 2020

Hello,

  1. This is due to the number of items in the Header and them surpassing the available width. You will need to manually decrease the Font Size and Padding to avoid issues on Smaller Sized Headers. Consider using the following code:

.device-lg #primary-menu ul li > a {
	padding-left: 12px;
	padding-right: 12px;
	letter-spacing: 0;
}
  1. Consider adding the following CSS Code:

.device-md .slider-caption h1 {
	font-size: 24px;
}

and then use the following HTML Code for the Slider:

  1. Adding the above HTML Code should fix this issue as well.

Hope this Helps!

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

SSoBuenoFeb 13, 2020

Thank you for the help.

We decided to use the Header Height CSS Generator to change the height and that made a big difference.

Thanks again.

SSemicolon WebSTAFFFeb 14, 2020

Hello,

Glad that your issues were resolved.

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

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard