Topic: Dropdown scroll issue on mobile view

Pytchoun free asked 4 years ago


Hello,

 

On mobile view i cant' scroll my dropdown content so i can't see it.

 

Maybe because of fixed navbar.


Marta Wierzbicka staff answered 3 years ago


Hi,

please, create a snippet showing your problem here: https://mdbootstrap.com/snippets/. I'll try to help you.

Best,


Chris Sweeney pro answered 3 years ago


Hi Marta

I'm having the same issue, but unfortunately I don't know which bit of the code you've altered. My navbar:

<nav class="navbar navbar-expand-lg fixed-top white">
<!-- Navbar brand -->
  <a class="navbar-brand" href="../../clubs/homepage.php?ClubID=1103">

     Club of Conwy        </a>

        <!-- Collapse button -->

<!-- Links -->
<ul class="navbar-nav ml-auto">
      <!-- Dropdown -->
  <li class="nav-item dropdown">
    <a class="nav-link dropdown-toggle" id="dd2" data-toggle="dropdown" aria-haspopup="true"
      aria-expanded="false"><i class="fas fa-users-cog"></i> Search/Find/Contact members...</a>
    <div class="dropdown-menu dropdown-primary" aria-labelledby="dd2">
              <a class="dropdown-item" href="membership.php?YrID=114"><i class="fas fa-users"></i> Club members</a>
                          <a class="dropdown-item" href="district-team.php"><i class="fas fa-user-friends"></i> The District Team</a>
                <a class="dropdown-item" href="http://dms.rotarygbi.org/login" target="_blank"><i class="fas fa-database"></i> RIBI DMS search and handbooks</a>
    </div>
  </li>
          <!-- Dropdown -->
  <li class="nav-item dropdown mr-1">
    <a class="nav-link dropdown-toggle" id="dd1" data-toggle="dropdown" aria-haspopup="true"
      aria-expanded="false"><i class="fas fa-user-alt"></i> Members Facilities</a>
    <div class="dropdown-menu dropdown-primary" aria-labelledby="dd1">
              <a class="dropdown-item" href="../admin/index.php"><i class="fas fa-hammer"></i> super administrator pages</a>

               <a class="dropdown-item" href="../dist-admin/a-what.php" title="district administrators main page"> <i class="fas fa-tools"></i> District Admin</a>
                          <a class="dropdown-item" href="../clubadmin/a-admin.php"><i class="fas fa-toolbox"></i> Club Admin Home</a>

      <a class="dropdown-item" href="what.php"><i class="fa fa-home"></i> Members Home</a>
      <a class="dropdown-item" href="member-details.php" title="Use this page to update your contact details, notification and privacy options, change your photo etc"><span class="fa fa-user" aria-hidden="true"></span> Update your details </a>
      <a class="dropdown-item" href="../../clubs/diary.php?ClubID=1103"><i class="fa fa-calendar" aria-hidden="true"></i> Future programme</a>
      <a class="dropdown-item" href="mo-pages-club.php"><i class="fa fa-lock" aria-hidden="true"></i> Pages for 'Members Only'</a>
                <a class="dropdown-item" href="members-mypages.php"><i class="fa fa-edit" aria-hidden="true"></i> Pages you've written + add a page</a>
                          <a class="dropdown-item" href="apologies.php"><i class="far fa-paper-plane"></i> Submit Meeting/Event Apologies</a>
                          <a class="dropdown-item" href="otherclubs-meetings.php" >Other clubs' meetings + Charter Celebrations</a>
      <a class="dropdown-item" href="members-ticklist.php"><i class="fas fa-check"></i> Create a members 'ticklist' for an event</a>
                <a class="dropdown-item" href="../newforums/index.php"><i class="far fa-comments"></i> Members forum</a>
               </div>
    <li class="nav-item active">
    <a class="nav-link" href="../../clubs/clublogout.php?ClubID=1103"><i class="fas fa-sign-out-alt" aria-hidden="true"></i> Logout</a>
  </li>

</ul>

Thanks Chris


Marta Wierzbicka staff answered 3 years ago


Hi,

I've checked your code and modified it and dropdown content scrolls. You can see it here: https://mdbootstrap.com/snippets/jquery/marta-szymanska/243029. If this code doesn't help you, please describe the issue in more details and I'll try to help you again.

Best,

Marta


Marta Wierzbicka staff answered 3 years ago


Hi,

please, create a snippet showing your problem here: https://mdbootstrap.com/snippets/. I'll try to help you.

Best,


Pytchoun free commented 3 years ago

Here https://mdbootstrap.com/snippets/jquery/pytchoun/240122



Please insert min. 20 characters.

FREE CONSULTATION

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

Status

Answered

Specification of the issue

  • User: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.5.15
  • Device: windwos
  • Browser: chrome
  • OS: windwos 10
  • Provided sample code: No
  • Provided link: No
Tags