diff --git a/app/views/projects/pipelines/charts.html.haml b/app/views/projects/pipelines/charts.html.haml
index 4d1d078661d..6b4110e07d2 100644
--- a/app/views/projects/pipelines/charts.html.haml
+++ b/app/views/projects/pipelines/charts.html.haml
@@ -2,12 +2,9 @@
 - page_title _('CI / CD Charts')
 
 %div{ class: container_class }
+
   #charts.ci-charts
-    .row
-      .col-md-6
-        = render 'projects/pipelines/charts/overall'
-      .col-md-6
-        = render 'projects/pipelines/charts/pipeline_times'
+    = render 'projects/pipelines/charts/overall'
 
     %hr
     = render 'projects/pipelines/charts/pipelines'
diff --git a/app/views/projects/pipelines/charts/_overall.haml b/app/views/projects/pipelines/charts/_overall.haml
index 66786c7ff59..651f9217455 100644
--- a/app/views/projects/pipelines/charts/_overall.haml
+++ b/app/views/projects/pipelines/charts/_overall.haml
@@ -1,15 +1,6 @@
-%h4= s_("PipelineCharts|Overall statistics")
-%ul
-  %li
-    = s_("PipelineCharts|Total:")
-    %strong= n_("1 pipeline", "%d pipelines", @counts[:total]) % @counts[:total]
-  %li
-    = s_("PipelineCharts|Successful:")
-    %strong= n_("1 pipeline", "%d pipelines", @counts[:success]) % @counts[:success]
-  %li
-    = s_("PipelineCharts|Failed:")
-    %strong= n_("1 pipeline", "%d pipelines", @counts[:failed]) % @counts[:failed]
-  %li
-    = s_("PipelineCharts|Success ratio:")
-    %strong
-      #{success_ratio(@counts)}%
+%h4.mt-4.mb-4= s_("PipelineCharts|Overall statistics")
+.row
+  .col-md-6
+    = render 'projects/pipelines/charts/pipeline_statistics'
+  .col-md-6
+    = render 'projects/pipelines/charts/pipeline_times'
diff --git a/app/views/projects/pipelines/charts/_pipeline_statistics.haml b/app/views/projects/pipelines/charts/_pipeline_statistics.haml
new file mode 100644
index 00000000000..b323e290ed4
--- /dev/null
+++ b/app/views/projects/pipelines/charts/_pipeline_statistics.haml
@@ -0,0 +1,14 @@
+%ul
+  %li
+    = s_("PipelineCharts|Total:")
+    %strong= n_("1 pipeline", "%d pipelines", @counts[:total]) % @counts[:total]
+  %li
+    = s_("PipelineCharts|Successful:")
+    %strong= n_("1 pipeline", "%d pipelines", @counts[:success]) % @counts[:success]
+  %li
+    = s_("PipelineCharts|Failed:")
+    %strong= n_("1 pipeline", "%d pipelines", @counts[:failed]) % @counts[:failed]
+  %li
+    = s_("PipelineCharts|Success ratio:")
+    %strong
+      #{success_ratio(@counts)}%
diff --git a/app/views/projects/pipelines/charts/_pipelines.haml b/app/views/projects/pipelines/charts/_pipelines.haml
index 47f1f074210..afff9e82e45 100644
--- a/app/views/projects/pipelines/charts/_pipelines.haml
+++ b/app/views/projects/pipelines/charts/_pipelines.haml
@@ -1,4 +1,4 @@
-%h4= _("Pipelines charts")
+%h4.mt-4.mb-4= _("Pipelines charts")
 %p
    
   %span.legend-success
diff --git a/changelogs/unreleased/ds-charts-whitespace.yml b/changelogs/unreleased/ds-charts-whitespace.yml
new file mode 100644
index 00000000000..210261764a2
--- /dev/null
+++ b/changelogs/unreleased/ds-charts-whitespace.yml
@@ -0,0 +1,5 @@
+---
+title: Improves section header whitespace on the CI/CD Charts page
+merge_request: 30531
+author:
+type: fixed