I can't seem to get the CSS right for the mobile version of a website

Beaver Builder
1

I have tried with CSS Hero, but something is causing it to spread wider than it should be… It seems that when I have to adjust the right positioned menu, I have this issue.

I must be doing something wrong…

2

Hey Pauline,

Can you share the URL of the site in question so we can check?

Ben

3

[Content Hidden]

4

Hey Pauline,

We’ll have to override a lot of your styling to make it work. Can you try the CSS snippet below and see if it works?

@media (max-width: 767px) {
  body .fl-page .fl-page-header .fl-page-nav {
    width: auto;
  }
  html body .fl-page-header .fl-page-nav .navbar-toggle {
    max-width: none;
    width: 100%;
  }
  body .fl-page .fl-page-header .fl-page-nav ul.nav {
    width: auto;
    height: auto;
  }
}

Ben

5

Thank you for this… it worked well
Appreciate your help

6

No worries at all, Pauline! Enjoy BB! :slight_smile:

Ben