Datatables button group dropdown-menu hover min-width too big

Viewed 42

I am not sure how to handle this breaking style issue after updating DataTables. This style issue did not appear for me in an older version of DataTables.

I have a custom DataTable using bootstrap 4 theme with various included libraries (see included libraries below). On the table I add a dropdown button group. When hovering a dropdown menu item, the hover background extends past the dropdown menu container caused by the following DataTables CDN style.

div.dt-button-collection .dt-button {
    min-width: 200px;
}

I can override the dropdown-menu style by adding a single pixel to the dropdown-menu width, but I would like to know if this is an acceptable fix on my part, or if this is a reportable DataTables breaking change issue.

/* override */
div.dt-button-collection .dt-button {
  min-width: auto !important;
}   

Previous version

This combined file was created by the DataTables downloader builder: https://datatables.net/download

To rebuild or modify this file with the latest versions of the included software please visit: https://datatables.net/download/#bs4/jszip-2.5.0/dt-1.10.18/b-1.5.6/b-flash-1.5.6/b-html5-1.5.6/b-print-1.5.6/cr-1.5.0/fh-3.1.4/kt-2.5.0/r-2.2.2/rr-1.2.4/sc-2.0.0/sl-1.3.0

Included libraries: JSZip 2.5.0, DataTables 1.10.18, Buttons 1.5.6, Flash export 1.5.6, HTML5 export 1.5.6, Print view 1.5.6, ColReorder 1.5.0, FixedHeader 3.1.4, KeyTable 2.5.0, Responsive 2.2.2, RowReorder 1.2.4, Scroller 2.0.0, Select 1.3.0

Updated version

This combined file was created by the DataTables downloader builder: https://datatables.net/download

To rebuild or modify this file with the latest versions of the included software please visit: https://datatables.net/download/#bs4/jszip-2.5.0/dt-1.12.1/b-2.2.3/b-html5-2.2.3/b-print-2.2.3/cr-1.5.6/date-1.1.2/fh-3.2.4/kt-2.7.0/r-2.3.0/rr-1.2.8/sc-2.0.7/sb-1.3.4/sp-2.0.2/sl-1.4.0

Included libraries: JSZip 2.5.0, DataTables 1.12.1, Buttons 2.2.3, HTML5 export 2.2.3, Print view 2.2.3, ColReorder 1.5.6, DateTime 1.1.2, FixedHeader 3.2.4, KeyTable 2.7.0, Responsive 2.3.0, RowReorder 1.2.8, Scroller 2.0.7, SearchBuilder 1.3.4, SearchPanes 2.0.2, Select 1.4.0

My jsbin

https://jsbin.com/mefuwey/edit?html,output

0 Answers
Related