diff --git a/assets/css/app.css b/assets/css/app.css
index cb475ed3..5688690a 100644
--- a/assets/css/app.css
+++ b/assets/css/app.css
@@ -641,4 +641,13 @@ label:not(.form-check-label) {
 
 .tooltip {
     pointer-events: none;
+}
+
+/* Style datatables */
+.card-footer-table {
+    padding-top: 0;
+}
+
+table.dataTable {
+    margin-top: 0 !important;
 }
\ No newline at end of file
diff --git a/assets/ts_src/ajax_ui.ts b/assets/ts_src/ajax_ui.ts
index 85398113..50834347 100644
--- a/assets/ts_src/ajax_ui.ts
+++ b/assets/ts_src/ajax_ui.ts
@@ -392,7 +392,13 @@ class AjaxUI {
                 });
 
             //Register links.
-            promise.then(ajaxUI.registerLinks);
+            promise.then(function() {
+                ajaxUI.registerLinks();
+
+                //Set the correct title in the table.
+                let title = $('#part-card-header-src');
+                $('#part-card-header').html(title.html());
+            });
         });
 
         console.debug('Datatables inited.');
diff --git a/config/packages/datatables.yaml b/config/packages/datatables.yaml
index 9e2b0630..a4b866f9 100644
--- a/config/packages/datatables.yaml
+++ b/config/packages/datatables.yaml
@@ -8,6 +8,13 @@ datatables:
         lengthMenu : [10, 25, 50, 100, 250, 500, 1000, 2500]
         pageLength: 50
         #dom: "<'row' <'col-sm-12' tr>><'row' <'col-sm-6'l><'col-sm-6 text-right'pif>>"
+        dom: "  <'row'<'col mb-2' l> <'col mb-2'<'pull-right' p>>>
+                        <'card border-primary'
+                            <'#part-card-header.card-header bg-primary text-white'>
+                            rt
+                            <'card-footer card-footer-table text-muted' i >
+                        >
+                        <'row'<'col mt-2' l> <'col mt-2'<'pull-right' p>>>"
         pagingType: 'simple_numbers'
         searching: true
 
diff --git a/templates/parts_list.html.twig b/templates/parts_list.html.twig
index 9a0af43c..4fd977f6 100644
--- a/templates/parts_list.html.twig
+++ b/templates/parts_list.html.twig
@@ -2,14 +2,26 @@
 
 {% block content %}
 
+    {#
     <div class="card border-primary">
         <div class="card-header bg-primary text-white">
             <h6>Bauteile</h6>
         </div>
-        <div id="part_list" class="table-responsive" data-datatable data-settings='{{ datatable_settings(datatable) }}'>
-            <div class="card-body">
-                <h4>{% trans %}part_list.loading.caption{% endtrans %}</h4>
-                <h6>{% trans %}part_list.loading.message{% endtrans %}</h6>
+
+        </div>
+    </div>
+    #}
+
+    {# Set the title for the table here. It will be inserted into the table later.#}
+    <div style="display:none;" id="part-card-header-src">Test</div>
+
+    <div id="part_list" class="table-responsive" data-datatable data-settings='{{ datatable_settings(datatable) }}'>
+        <div class="card-body">
+            <div class="card">
+                <div class="card-body">
+                    <h4>{% trans %}part_list.loading.caption{% endtrans %}</h4>
+                    <h6>{% trans %}part_list.loading.message{% endtrans %}</h6>
+                </div>
             </div>
         </div>
     </div>