diff --git a/packages/@ourworldindata/grapher/src/barCharts/DiscreteBarChart.tsx b/packages/@ourworldindata/grapher/src/barCharts/DiscreteBarChart.tsx
index e258a8a4174..635c50bcdb0 100644
--- a/packages/@ourworldindata/grapher/src/barCharts/DiscreteBarChart.tsx
+++ b/packages/@ourworldindata/grapher/src/barCharts/DiscreteBarChart.tsx
@@ -450,19 +450,21 @@ export class DiscreteBarChart
                     <HorizontalNumericColorLegend manager={this} />
                 )}
                 {this.showHorizontalAxis && (
-                    <HorizontalAxisComponent
-                        bounds={boundsWithoutColorLegend}
-                        axis={yAxis}
-                        preferredAxisPosition={innerBounds.bottom}
-                        labelColor={manager.secondaryColorInStaticCharts}
-                        tickMarkWidth={axisLineWidth}
-                    />
+                    <>
+                        <HorizontalAxisComponent
+                            bounds={boundsWithoutColorLegend}
+                            axis={yAxis}
+                            preferredAxisPosition={innerBounds.bottom}
+                            labelColor={manager.secondaryColorInStaticCharts}
+                            tickMarkWidth={axisLineWidth}
+                        />
+                        <HorizontalAxisGridLines
+                            horizontalAxis={yAxis}
+                            bounds={innerBounds}
+                            strokeWidth={axisLineWidth}
+                        />
+                    </>
                 )}
-                <HorizontalAxisGridLines
-                    horizontalAxis={yAxis}
-                    bounds={innerBounds}
-                    strokeWidth={axisLineWidth}
-                />
                 {sizedSeries.map((series) => {
                     // Todo: add a "placedSeries" getter to get the transformed series, then just loop over the placedSeries and render a bar for each
                     const isNegative = series.value < 0
diff --git a/packages/@ourworldindata/grapher/src/stackedCharts/StackedDiscreteBarChart.tsx b/packages/@ourworldindata/grapher/src/stackedCharts/StackedDiscreteBarChart.tsx
index 045b689bf47..a595dae72f5 100644
--- a/packages/@ourworldindata/grapher/src/stackedCharts/StackedDiscreteBarChart.tsx
+++ b/packages/@ourworldindata/grapher/src/stackedCharts/StackedDiscreteBarChart.tsx
@@ -682,19 +682,21 @@ export class StackedDiscreteBarChart
                     fill="rgba(255,255,255,0)"
                 />
                 {this.showHorizontalAxis && (
-                    <HorizontalAxisComponent
-                        bounds={bounds}
-                        axis={yAxis}
-                        preferredAxisPosition={innerBounds.bottom}
-                        labelColor={manager.secondaryColorInStaticCharts}
-                        tickMarkWidth={axisLineWidth}
-                    />
+                    <>
+                        <HorizontalAxisComponent
+                            bounds={bounds}
+                            axis={yAxis}
+                            preferredAxisPosition={innerBounds.bottom}
+                            labelColor={manager.secondaryColorInStaticCharts}
+                            tickMarkWidth={axisLineWidth}
+                        />
+                        <HorizontalAxisGridLines
+                            horizontalAxis={yAxis}
+                            bounds={innerBounds}
+                            strokeWidth={axisLineWidth}
+                        />
+                    </>
                 )}
-                <HorizontalAxisGridLines
-                    horizontalAxis={yAxis}
-                    bounds={innerBounds}
-                    strokeWidth={axisLineWidth}
-                />
                 {this.showLegend && (
                     <HorizontalCategoricalColorLegend manager={this} />
                 )}