This topic contains 1 reply, has 2 voices, and was last updated by Sean Sean 1 year, 9 months ago.

"Actions" Dropdown in responsive tables do not display right on smaller screens


  • GHD
    Participant

    Posts: 1
    Member Reply #10378

    On page: http://keenthemes.com/preview/metronic/theme/admin_1/table_datatables_managed.html

    When table’s “responsiveness” (ie scrollbar) kicks in at lower screens the “Actions” drop down floats outside of the table and in some instances off screen. I have a need for this function, actions drop down in a responsive table but the current solution isn’t working and I can’t seem to figure out how to fix it without having the drop down show up in the scrolling table causing me to scroll to view the drop down.

    Any help with this is appreciated, thank you!

    Sean
    Sean
    Keymaster

    Posts: 4527
    Support Staff Reply #10390

    Hi,

    Thanks for your feedback. So far we could not find proper solution for this issue due to the complexity of the layout that uses overflow:hidden. We will be checking this further and implement it with different approach from scratch. In the meantime as a workaround i would suggest you making the dropdown menu inline for mobile modes by adding below code in your custom.min.css:

    @media (max-width: 768px) {
    .table .btn-group {
    position: relative !important;
    }

    .table .btn-group.open .dropdown-menu {
    position: static !important;
    }
    }

    Thanks.

You must be logged in to reply to this topic.