diff --git a/src/block/carousel/frontend-carousel.js b/src/block/carousel/frontend-carousel.js
index 25e6af8799..f62577bc2c 100644
--- a/src/block/carousel/frontend-carousel.js
+++ b/src/block/carousel/frontend-carousel.js
@@ -491,9 +491,9 @@ class _StackableCarousel {
 	onWheel = e => {
 		const sliderElScrollLeft = this.sliderEl.scrollLeft
 		const lastSlideOffset = this.slideEls[ this.slideEls.length - 1 ].offsetLeft
-		const firstCloneOffset = this.clones[ 0 ].offsetLeft
 		const slidesOffset = this.slideEls.map( slide => slide.offsetLeft )
-		const clonesOffset = this.clones.map( slide => slide.offsetLeft )
+		const firstCloneOffset = this.infiniteScroll && this.clones.length ? this.clones[ 0 ].offsetLeft : 0
+		const clonesOffset = this.infiniteScroll && this.clones.length ? this.clones.map( slide => slide.offsetLeft ) : []
 		if ( this.type === 'fade' ) {
 			if ( this.wheelTimeout ) {
 				return
@@ -549,7 +549,7 @@ class _StackableCarousel {
 		let dx = e.clientX - this.initialClientX
 		const sliderElScrollLeft = this.sliderEl.scrollLeft
 		const lastSlideOffsetLeft = this.slideEls[ this.slideEls.length - 1 ].offsetLeft
-		const firstCloneOffsetLeft = this.clones[ 0 ].offsetLeft
+		const firstCloneOffsetLeft = this.infiniteScroll && this.clones.length ? this.clones[ 0 ].offsetLeft : 0
 
 		if ( this.type === 'slide' ) {
 			if ( this.infiniteScroll && sliderElScrollLeft === 0 && dx > 0 ) {
diff --git a/src/styles/block.scss b/src/styles/block.scss
index fabcb39f59..fc819b3d2f 100644
--- a/src/styles/block.scss
+++ b/src/styles/block.scss
@@ -54,6 +54,8 @@
 
 @include desktop-tablet {
 	.stk-block:is(.aligncenter, .alignwide, .alignfull) > .stk-content-align:not(.alignwide):not(.alignfull),
+	// Dev note: add selector for carousel because it has an extra wrapper before the inner blocks.
+	.stk-block-carousel:is(.aligncenter, .alignwide, .alignfull) > :where(.stk-block-carousel__content-wrapper) > .stk-content-align:not(.alignwide):not(.alignfull),
 	.stk-block .stk-block.aligncenter {
 		// --stk-block-default-width is a Stackable setting
 		// --stk-block-width-default-detected is from the fallback autodetected value.
diff --git a/src/styles/editor-block.scss b/src/styles/editor-block.scss
index 1a2a6a1dbf..a58ad8ff4b 100644
--- a/src/styles/editor-block.scss
+++ b/src/styles/editor-block.scss
@@ -104,7 +104,9 @@
 
 // For wide/full width blocks, but with their contents center aligned.
 :where(:is(.stk-preview-device-desktop, .stk-preview-device-tablet) [data-type^="stackable/"]:is([data-align="wide"], [data-align="full"]) > .stk-block > .stk-inner-blocks:not(.alignwide):not(.alignfull)),
-:where(:is(.stk-preview-device-desktop, .stk-preview-device-tablet) [data-type^="stackable/"]:is([data-align="wide"], [data-align="full"]) [data-type^="stackable/"][data-align="center"]) {
+:where(:is(.stk-preview-device-desktop, .stk-preview-device-tablet) [data-type^="stackable/"]:is([data-align="wide"], [data-align="full"]) [data-type^="stackable/"][data-align="center"]),
+// Dev note: add selector for carousel because it has an extra wrapper before the inner blocks.
+:where(:is(.stk-preview-device-desktop, .stk-preview-device-tablet) [data-type^="stackable/"]:is([data-align="wide"], [data-align="full"]) > .stk-block-carousel > :where(.stk-block-carousel__content-wrapper) > .stk-inner-blocks:not(.alignwide):not(.alignfull)) {
 	// --stk-block-default-width is a Stackable setting
 	// --stk-block-width-default-detected is from the fallback autodetected value.
 	max-width: var(--stk-block-default-width, var(--stk-block-width-default-detected, 900px)) !important;