lyndon.webster pro asked 7 years ago


Hi there, I've seen references in the documentation to a class called .mobile-nofixed However, this class name is not found in any of the MDB CSS or JS files. Unsurprisingly, adding this class to my navbar has no effect: <nav class="navbar fixed-top scrolling-navbar mobile-nofixed"> Am I missing something or is this missing from the latest version? Thanks, Lyndon.

lyndon.webster pro answered 7 years ago


Thanks, in one of the examples that mentions this class: https://mdbootstrap.com/live/_MDB/index/docs/page-layouts/side-nav-fixed-navbar-fixed.html There is 88px of padding to the top of the page to move <main> down below the <nav> (given the nav is not relatively positioned). Once the mobile-nofixed takes effect and the <nav> becomes relatively positioned this causes the content to jump down the page 88px effectively breaking the layout (i.e. padding is from the bottom of the nav bar not the top of the screen). If using mobile-nofixed is there another class that needs to be added to <main> to get it to deal with this switch in display style? I can easily set something up myself but seems like another bit is missing somewhere? Thanks, Lyndon.

Kamil Paciepnik free answered 7 years ago


Hi This is a bug that will improve in MDB 4.3.1. Thanks for reporting!
@media only screen and (max-width: 992px) {
    // Non-fixed Navbar on smaller devices
    .navbar.mobile-nofixed {
        position: relative;
    }
}
Regards

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: Yes
  • Provided link: No
Tags