diff --git a/data-table.js b/data-table.js
index 74f1fee..1b0ece1 100644
--- a/data-table.js
+++ b/data-table.js
@@ -94,10 +94,10 @@ class DataTable extends IgniteElement {
     render() {
         return this.template.child(
             new div().show([this.showPageSize, this.showSearchBox, this.showRowCount], (pageSize, searchBox, rowCount) => pageSize || searchBox || rowCount).class("row mb-3").child(
-                new div().class("col-12 d-flex flex-row justify-content-between gap-3").child(
-                    new div().class("d-flex flex-row gap-3").child(
+                new div().class("col-12 d-flex flex-row justify-content-between gap-3 flex-wrap").child(
+                    new div().class("d-flex flex-row gap-3 flex-wrap flex-grow-1 flex-sm-grow-0").child(
                         //Page size selector
-                        new div().show(this.showPageSize).class("input-group flex-nowrap w-auto").child(
+                        new div().show(this.showPageSize).class("input-group flex-nowrap w-auto flex-grow-1 flex-sm-grow-0").child(
                             new span().class("input-group-text border-0 bg-white").child(`<i class="fa-solid fa-list-ul"></i>`),
 
                             new select().class("form-select border-0 w-auto").child(
@@ -106,7 +106,7 @@ class DataTable extends IgniteElement {
                         ),
 
                         //Search box
-                        new div().show(this.showSearchBox).class("input-group flex-nowrap").child(
+                        new div().show(this.showSearchBox).class("input-group flex-nowrap w-auto flex-grow-1").child(
                             new span().class("input-group-text border-0 bg-white").child(`<i class="fa-solid fa-magnifying-glass"></i>`),
 
                             new input().class("form-control")
@@ -122,20 +122,22 @@ class DataTable extends IgniteElement {
                     ),
 
                     //Rows count
-                    new div().show(this.showRowCount).class("bg-white p-2 rounded-2 d-flex align-items-center justify-content-center").innerHTML(this.results, results => results.length == 0 ? "No rows" : `${results.length} ${(results.length < 2 ? "row" : "rows")}`)
+                    new div().show(this.showRowCount).class("d-sm-flex d-none align-items-center justify-content-end text-nowrap flex-grow-1").child(
+                        new span().class("bg-white p-2 rounded-2").innerHTML(this.results, results => results.length == 0 ? "No rows" : `${results.length} ${(results.length < 2 ? "row" : "rows")}`)
+                    )
                 )
             ),
 
-            new div().class("table-responsive overflow-hidden rounded-2 mb-3").child(
+            new div().class("table-responsive rounded-2 mb-3").child(
                 new table().class("table table-striped align-middle mb-0").child(
                     //Table columns
                     new thead().class("table-dark").child(
                         new tr().child(
                             new list(this.columns, column => { 
                                 if (column instanceof DataColumn) {
-                                    return new th().attribute("scope", "col").child(column.name);
+                                    return new th().class("text-nowrap").attribute("scope", "col").child(column.name);
                                 } else {
-                                    return new th().attribute("scope", "col").child(column);
+                                    return new th().class("text-nowrap").attribute("scope", "col").child(column);
                                 }
                             })
                         )
@@ -149,12 +151,12 @@ class DataTable extends IgniteElement {
             ),
 
             new div().class("row").child(
-                new div().class("col-12 d-flex flex-row gap-3 flex-wrap").child(
+                new div().class("col-12 d-flex flex-row gap-3 flex-wrap justify-content-between").child(
                     //Pages
-                    new div().class("btn-group").child(
+                    new div().class("btn-group flex-wrap justify-content-center d-none d-sm-flex").child(
                         //Previous page button
                         new button()
-                            .class("btn btn-secondary")
+                            .class("btn btn-secondary flex-grow-0")
                             .child(`<i class="fa-solid fa-chevron-left"></i>`)
                             .onClick(() => {
                                 if (this.currentPage > 0) {
@@ -172,7 +174,7 @@ class DataTable extends IgniteElement {
                                     return null;
                                 }
                                 return new button()
-                                    .class("btn text-center")
+                                    .class("btn text-center flex-grow-0")
                                     .style("width", "3em")
                                     .class(current, current => current ? "btn-primary" : "btn-secondary")
                                     .innerText(filler ? "..." : index + 1)
@@ -181,7 +183,7 @@ class DataTable extends IgniteElement {
 
                         //Next page button
                         new button()
-                            .class("btn btn-secondary")
+                            .class("btn btn-secondary flex-grow-0")
                             .child(`<i class="fa-solid fa-chevron-right"></i>`)
                             .onClick(() => {
                                 if (this.currentPage < this.pageCount) {
@@ -191,11 +193,11 @@ class DataTable extends IgniteElement {
                     ),
 
                     //Page jump to
-                    new div().show(this.showPageJumpTo).class("input-group flex-nowrap w-auto").child(
+                    new div().show(this.showPageJumpTo).class("input-group flex-nowrap w-auto flex-grow-1 flex-sm-grow-0").child(
                         new select().class("form-select border-0 w-auto").child(
                             new population(
                                 this.pageCount, 
-                                index => new option().attribute("selected", this.currentPage, currentPage => currentPage == index ? "selected" : null).value(index).child(index + 1)
+                                index => new option().attribute("selected", this.currentPage, currentPage => currentPage == index ? "selected" : null).value(index).innerText(`Page ${index + 1}`)
                             )
                         ).value(this.currentPage, true)
                     )