Bootstrap 4 issue
Bootstrap 4 issue
kamov
Posts: 12Questions: 2Answers: 0
When you use bootstrap 4 it wrap all inside col-xs-12 which don't exist anymore in bootstrap 4.
It's required to use .col class
How to fix this?
Thanks
This question has an accepted answers - jump to answer
This discussion has been closed.
Answers
Hi @kamov ,
Try changing
col-xs-12tocol-12and according to this StackOverflow post, it should work as expected.Cheers,
Colin
Have you changed your Bootstrap integration for DataTables to be the Bootstrap 4 integration rather than Bootstrap 3? The download builder can help with that.
The Bootstrap 4 integration file for DataTables uses
col-sm-*.Allan
hi Allan,
yes sure I am using bootstrap 4 template.
I used bower to install
bower install --save datatables.net-bs4
See here html structure created:
https://www.dropbox.com/s/f5yfe30kflln90p/Screen%20Shot%202018-04-17%20at%2011.00.46.png?dl=0
The class is: col-xs-12 col-md-6
I can't replace because that code is generated by datatables.
My html code is just table:
Seem that code download by bower use an old version, because my code is like this:
https://www.dropbox.com/s/24x77yec3c1afmg/Screen%20Shot%202018-04-17%20at%2011.05.52.png?dl=0
Ok, seem that bower load bootstrap 3 and not bootstrap 4:
https://www.dropbox.com/s/l4ux8041r8niij4/Screen%20Shot%202018-04-17%20at%2011.07.30.png?dl=0
I think that's actually just a typo in the file header. Scroll down the file and it should use the correct column class names for BS4.
Allan
No, check first screenshot:
https://www.dropbox.com/s/24x77yec3c1afmg/Screen%20Shot%202018-04-17%20at%2011.05.52.png?dl=0
bower install --save datatables.net-bs4
bower datatables.net-bs4#* cached https://github.com/DataTables/Dist-DataTables-Bootstrap4.git#3.2.2
bower datatables.net-bs4#* validate 3.2.2 against https://github.com/DataTables/Dist-DataTables-Bootstrap4.git#*
bower datatables.net-bs4#^3.2.2 cached https://github.com/DataTables/Dist-DataTables-Bootstrap4.git#3.2.2
bower datatables.net-bs4#^3.2.2 validate 3.2.2 against https://github.com/DataTables/Dist-DataTables-Bootstrap4.git#^3.2.2
bower datatables.net-bs4#^3.2.2 install datatables.net-bs4#3.2.2
Then file is always bootstrap 3, but named bootstrap4
Also here there is not wrong header:
https://github.com/DataTables/DataTablesSrc/blob/master/js/integration/dataTables.bootstrap4.js#L1-L3
See here: https://npm.runkit.com/datatables.net-bs4/js/dataTables.bootstrap4.js?t=1523959872598
Seem that is bootstrap 3 and not 4.
The version tag of 3.2.2 looks wrong. The current version is 1.10.16 - https://www.npmjs.com/package/datatables.net-bs4 . That does contain the typo (which is fixed for 1.10.17 when that is released).
3.2.2 was an incorrect tag a while back, but it was deprecated. 1.10.16 is the current.
Allan
This is the commit that fixed the typo.
Thank you!