diff --git a/defaultmodules/weather/forecast.njk b/defaultmodules/weather/forecast.njk
index 047cd8b751..ddf0fd4b2e 100644
--- a/defaultmodules/weather/forecast.njk
+++ b/defaultmodules/weather/forecast.njk
@@ -1,7 +1,8 @@
 {% if forecast %}
   {% set numSteps = forecast | calcNumSteps %}
   {% set currentStep = 0 %}
-  <div class="{{ config.tableClass }} weather-forecast" role="table">
+  {% set columnCount = 4 + (1 if config.showUVIndex else 0) + (1 if config.showPrecipitationAmount else 0) + (1 if config.showPrecipitationProbability else 0) %}
+  <div class="{{ config.tableClass }} weather-forecast" role="table" style="--weather-columns: {{ columnCount }};">
     {% if config.ignoreToday %}
       {% set forecast = forecast.splice(1) %}
     {% endif %}
diff --git a/defaultmodules/weather/hourly.njk b/defaultmodules/weather/hourly.njk
index 61fdc5bc4c..592af54260 100644
--- a/defaultmodules/weather/hourly.njk
+++ b/defaultmodules/weather/hourly.njk
@@ -1,7 +1,8 @@
 {% if hourly %}
   {% set numSteps = hourly | calcNumEntries %}
   {% set currentStep = 0 %}
-  <div class="{{ config.tableClass }} weather-hourly" role="table">
+  {% set columnCount = 3 + (1 if config.showUVIndex else 0) + (1 if config.showHumidity != "none" else 0) + (1 if config.showPrecipitationAmount else 0) + (1 if config.showPrecipitationProbability else 0) %}
+  <div class="{{ config.tableClass }} weather-hourly" role="table" style="--weather-columns: {{ columnCount }};">
     {% set hours = hourly.slice(0, numSteps) %}
     {% for hour in hours %}
       <div class="weather-hourly-row{% if config.colored %}{{ " colored" }}{% endif %}" role="row" {% if config.fade %}style="opacity: {{ currentStep | opacity(numSteps) }};"{% endif %}>
diff --git a/defaultmodules/weather/weather.css b/defaultmodules/weather/weather.css
index 56bb41de02..92eab07598 100644
--- a/defaultmodules/weather/weather.css
+++ b/defaultmodules/weather/weather.css
@@ -13,9 +13,12 @@
 
 .weather .weather-forecast,
 .weather .weather-hourly {
-  display: grid;
+  display: inline-grid;
+  vertical-align: top;
   width: max-content;
-  grid-template-columns: repeat(7, max-content);
+
+  /* Templates set --weather-columns to the number of enabled columns, so no empty tracks and gaps are reserved */
+  grid-template-columns: repeat(var(--weather-columns, 7), max-content);
 }
 
 .weather .weather-forecast-row,
diff --git a/tests/e2e/modules/weather_forecast_spec.js b/tests/e2e/modules/weather_forecast_spec.js
index f880f8e085..594300164f 100644
--- a/tests/e2e/modules/weather_forecast_spec.js
+++ b/tests/e2e/modules/weather_forecast_spec.js
@@ -62,6 +62,12 @@ describe("Weather module: Weather Forecast", () => {
 				expect(firstCell.x).toBe(secondCell.x);
 			}
 		});
+
+		it("should not reserve space for disabled columns", async () => {
+			const grid = await page.locator(".weather .weather-forecast").boundingBox();
+			const lastCell = await page.locator(".weather .weather-forecast-row:nth-child(1) .max-temp").boundingBox();
+			expect(grid.x + grid.width - (lastCell.x + lastCell.width)).toBeLessThan(1);
+		});
 	});
 
 	describe("Absolute configuration", () => {
diff --git a/tests/e2e/modules/weather_hourly_spec.js b/tests/e2e/modules/weather_hourly_spec.js
index 446dc68c77..e712943622 100644
--- a/tests/e2e/modules/weather_hourly_spec.js
+++ b/tests/e2e/modules/weather_hourly_spec.js
@@ -30,6 +30,12 @@ describe("Weather module: Weather Hourly Forecast", () => {
 				expect(firstCell.x).toBe(secondCell.x);
 			}
 		});
+
+		it("should not reserve space for disabled columns", async () => {
+			const grid = await page.locator(".weather .weather-hourly").boundingBox();
+			const lastCell = await page.locator(".weather .weather-hourly-row:nth-child(1) .temperature").boundingBox();
+			expect(grid.x + grid.width - (lastCell.x + lastCell.width)).toBeLessThan(1);
+		});
 	});
 
 	describe("Hourly weather options", () => {