diff --git a/src/runtime/transition/index.ts b/src/runtime/transition/index.ts
index 6bbde5af97..fb4663353b 100644
--- a/src/runtime/transition/index.ts
+++ b/src/runtime/transition/index.ts
@@ -105,8 +105,9 @@ export function slide(node: Element, {
 	delay = 0,
 	duration = 400,
 	easing = cubicOut,
-	axis = 'y'
+	axis = 'x'
 }: SlideParams = {}): TransitionConfig {
+	const direction: { x: 1 | 0, y: 1 | 0 } = { x: axis === 'x' ? 1 : 0, y: axis === 'y' ? 1 : 0 };
 	const style = getComputedStyle(node);
 	const opacity = +style.opacity;
 	const height = parseFloat(style.height);
@@ -129,15 +130,13 @@ export function slide(node: Element, {
 		duration,
 		easing,
 		css: t =>
-			`--y_axis_t: ${axis === 'y' ? t : 1};` +
-			`--x_axis_t: ${axis === 'x' ? t : 1};` +
 			'overflow: hidden;' +
 			`opacity: ${Math.min(t * 20, 1) * opacity};` +
-			`height: calc(var(--yAxisT) * ${height}px);` +
-			`width: calc(var(--xAxisT) * ${width}px);` +
-			`padding: calc(var(--yAxisT) * ${padding_top}px) calc(var(--xAxisT) * ${padding_right}px) calc(var(--yAxisT) * ${padding_bottom}px) calc(var(--xAxisT) * ${padding_left}px);` +
-			`margin: calc(var(--yAxisT) * ${margin_top}px)  calc(var(--xAxisT) * ${margin_right}px) calc(var(--yAxisT) * ${margin_bottom}px) calc(var(--xAxisT) * ${margin_left}px);` +
-			`border-width: calc(var(--yAxisT) * ${border_top_width}px) calc(var(--xAxisT) * ${border_right_width}px) calc(var(--yAxisT) * ${border_bottom_width}px) calc(var(--xAxisT) * ${border_left_width}px);`
+			`height: ${t ** direction.y * height}px;` +
+			`width: ${t ** direction.x * width}px;` +
+			`padding: ${t ** direction.y * padding_top}px ${t ** direction.x * padding_right}px ${t ** direction.y * padding_bottom}px) ${t ** direction.x * padding_left}px;` +
+			`margin: ${t ** direction.y * margin_top}px  ${t ** direction.x * margin_right}px ${t ** direction.y * margin_bottom}px ${t ** direction.x * margin_left}px;` +
+			`border-width: ${t ** direction.y * border_top_width}px ${t ** direction.x * border_right_width}px ${t ** direction.y * border_bottom_width}px ${t ** direction.x * border_left_width}px;`
 	};
 }