Quantcast
Channel: DataTables 1.10 — DataTables forums
Viewing all articles
Browse latest Browse all 2364

Bootstrap 4 - Table Buttons - small device

$
0
0

Hi everyone,

I'm atm. migrating my page to bootstrap 4 and encounter a problem with the table buttons and don't know whats the best way to solve it.

I use following code to get the length dropdown above the buttons:

dom:             "<'row'<'col-sm-3' l >>" + "<'row'<'col-sm-12 col-lg-9' B ><'col-sm-12 col-lg-3' f >>" + "trip",   //l = length Menue, B = Buttons, f = filter (search)

Clear the automatic set classes on the buttons with this code (as I use custom classes on the buttons):

  var objDom = {
    dom: {
      button: {
        className: 'btn m-1'
      }
    },
    buttons: [obj]
  }

Now to my problem, I use quite a few buttons and they work fine on desktop. But when I use smaller devices the buttons don't make a line break:
https://i.imgur.com/cOTj43o.png
for example my old version with bootstrap 3:
https://i.imgur.com/VJSQeUP.png

I also tried to remove the col-x before the buttons and give each button their own col-x but this also don't work as expected.

Cheers
Hannes


Viewing all articles
Browse latest Browse all 2364

Trending Articles