When using the dropdown menu within a table cell: <div class="snippet-clipboard-co

<a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/us

Hi <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="

Dropdown menu within table shows a scrollbar when opened,about creativetimofficial/ct-argon-dashboard-pro

Comments (8)

rarestoma commented on May 29, 2024

Hi,

Thank you for working with our products.

To fix that, please add 'overflow-visible' class on the div just before the table.

It will look like:

<div class="table-responsive overflow-visible">
              <table class="table align-items-center table-flush">
                     ...
              </table>
</div>

All the best,
Rares

from ct-argon-dashboard-pro.

assisjeferson commented on May 29, 2024

@rarestoma it's dont work when you use in mobile

Add data-boundary="window" in the dropdown

<td class="text-right">
  <div class="dropdown">
    <a class="btn btn-sm btn-icon-only text-light" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-boundary="window">
      <i class="fas fa-ellipsis-v"></i>
    </a>
    <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
      <a class="dropdown-item" href="#">Action</a>
      <a class="dropdown-item" href="#">Another action</a>
      <a class="dropdown-item" href="#">Something else here</a>
    </div>
  </div>
</td>

But you use .table-responsive in iOS the button dont work because has a bug with css (webkit-overflow-scrolling)

from ct-argon-dashboard-pro.

rarestoma commented on May 29, 2024

Hi,

Sorry for our last response :(

I tested it with just data-boundary="window" and it works fine.

Did you try this way?

All the best,
Rares

from ct-argon-dashboard-pro.

Austinbreathesair commented on May 29, 2024

I'm currently experiencing issues with the drop-down components. I use the ones from the docs but on my side when selecting the button it doesn't present the drop-down fields.

      <div class="btn-group">
        <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true"
          aria-expanded="false">Allocate Performer Group</button>
        <div class="dropdown-menu">
          <a class="dropdown-item" href="#">Action</a>
          <a class="dropdown-item" href="#">Another action</a>
          <a class="dropdown-item" href="#">Something else here</a>
          <div class="dropdown-divider"></div>
          <a class="dropdown-item" href="#">Separated link</a>
        </div>
      </div>
    </div>

from ct-argon-dashboard-pro.

jaisankargopal commented on May 29, 2024

I'm facing the similar problem. Drop down list covering by the class="ct-chart"

list.txt

drpdwn.docx

from ct-argon-dashboard-pro.

jaisankargopal commented on May 29, 2024

I'm facing the similar problem. Drop down list covering by the class="ct-chart"

from ct-argon-dashboard-pro.

rarestoma commented on May 29, 2024

Hi @jaisankargopal,

Thank you for working with our products. I see that you are using our Material Dashboard. Please open a issue at the Material Dashboard official repo:

Free Version: https://github.com/creativetimofficial/material-dashboard/issues
PRO Version: https://github.com/creativetimofficial/ct-material-dashboard-pro/issues

I hope it helps.

All the best,
Rares

from ct-argon-dashboard-pro.

jaisankargopal commented on May 29, 2024

Thanks.

from ct-argon-dashboard-pro.

Recommend Projects