Layout broken after Off-canvas menu fix according to FAQ - Forum | JoomShaper
Awaiting an answer Helix Framework

Layout broken after Off-canvas menu fix according to FAQ

Asked by Rolf Laepple 4 years ago Last activity 4 years ago

Joomla 3.10.4
PHP 7.4
SP Page Builder 8.2

Hello folks!

After updating the template helix ultimate to version 2.0.5, I had the problem that the off-canvas menu was no longer displayed. By following the procedure described in the FAQ, I was able to solve the problem and the Off-canvas menu is visible again.
Unfortunately, the layout is now disturbed. The main menu has moved to the right, the page spacing is no longer correct and the breadcrumb design is also faulty, to name just a few examples. Here are screenshots of the homepage before and after the Off-canvas fix.
I tested in Firefox and Chrome last versions. Browser cache was deleted when I dicovered the issue.

Before fix: https://imgur.com/uHImy6I

After fix: https://imgur.com/sofMdew

Best regards
Rolf

3 replies

Rashida Rahman Staff

Hi there!

Thanks for your query and sorry for the inconvenience!

Please use the following code in your custom.css file to get youe menu left aligned:

#sp-menu > .sp-column, 
 #sp-menu .sp-megamenu-wrapper { justify-content: flex-start !important;}

Then it will look like this: https://prnt.sc/2508094

The page spacing looks okay from my end I think...

For the breadcrumb:

 .breadcrumb {
    display: inline-flex;
 }

Hope this helps!

Best Regards

Rolf Laepple Asked this
4 years ago · edited

Hi Rashida,

thank you for the css-snippets. It worked.

I restored the left and right paddings by changing the custom.css to

hashtag sp-main-body {
padding: 0 20px 20px 20px;
}

Is there a way to keep the paddings zero when site is displayed on mobile devices?

Best regards
Rolf

Rolf Laepple Asked this

Hi Rashida,

probably you haven't seen my question:

Is there a way to keep the paddings zero when site is displayed on mobile devices?

Also I need to enlarge paddings and font-size of links in modules with costum content when site is displayed on mobile devices because Google search console is complaining with this.

Best regards
Rolf

Log in to reply.