PpotteryguyMar 16, 2021
Hello! I think this template is terrific.
Is there a way for our header to resize more seamlessly and smoother as it goes to mobile? And how can we make the header white in mobile view?
Thank you!
Resizing of header
1 reply · opened Mar 16, 2021
SSemicolon WebSTAFFMar 17, 2021
Hello,
Since you are using the Full-Width Menu and the Width is flexible, there are too many items or Longer Items in the Menu than the available width when the window is resized. You can consider decreasing the Size of the Text in the Menu:
[ch_pre type="css"].device-lg .menu-container > .menu-item > .menu-link {
padding-left: 12px;
padding-right: 12px;
font-size: 12px;
letter-spacing: 0px;
}[/ch_pre]
Additionally, to decrease the Size of the Logo, you can consider using the following code:
[ch_pre type="css"].device-lg #header:not(.sticky-header-shrink) #logo img {
height: 70px;
margin-top: 15px;
margin-bottom: 15px;
}[/ch_pre]
To make the Header Light on Responsive Devices, simply add the data-responsive-class="not-dark" to the #header Tag.
Hope this Helps!
Let us know if we can help you with anything else or if you find any further issues.
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