Align on small screen

Raffe

Hello, how can I align the buttons and the pagination to the center of the screen? I have tried this (and many other configuration, but I can not get it to align)

    dom: 
        "<'row'<'col-sm-12'B>>" +
        "<'row'<'col-sm-12'f>>" +
        "<'row'<'col-sm-12'tr>>" +
        "<'row'<'col-sm-12'l>>" +
        "<'row'<'col-sm-12'p>>",

Raffe

allan

It actually should by default (assuming this is Bootstrap 4 you are using)? See this example on a small screen.

Can you give me a link to your page showing the issue so I can help to debug it please?

Allan

Raffe

Hello Alan,

I have done an example, from the example you gave me the link to. The code in the link works but the way I define the buttons, they will not be centered. I would prefer that the button did not expend? Is that possible?

Example:

https://jsfiddle.net/9ypLoqfh/

Cheers Raffe

allan

Hi Raffe,

You need to add justify-content: center; to your CSS for the div.dt-buttons element: https://jsfiddle.net/CloudTables/ydmx58se/ .

Allan

Raffe

Hi Allan,

I can not see that the button are centered on small screen in your example?

Raffe

colin

@allan had one too many divs in that CSS line - see updated example here: https://jsfiddle.net/Lt3szy1m/

Colin

Raffe

Thanks Colin and Alan! You are super!!