diff --git a/packages/@react-spectrum/s2/src/CardView.tsx b/packages/@react-spectrum/s2/src/CardView.tsx
index 073598091ae..208166342a7 100644
--- a/packages/@react-spectrum/s2/src/CardView.tsx
+++ b/packages/@react-spectrum/s2/src/CardView.tsx
@@ -179,6 +179,12 @@ const cardViewStyles = style({
   outlineOffset: -2
 }, getAllowedOverrides({height: true}));
 
+const wrapperStyles = style({
+  position: 'relative', 
+  overflow: 'clip', 
+  size: 'fit'
+}, getAllowedOverrides({height: true}));
+
 export const CardViewContext = createContext<ContextValue<Partial<CardViewProps<any>>, DOMRefValue<HTMLDivElement>>>(null);
 
 export const CardView = /*#__PURE__*/ (forwardRef as forwardRefType)(function CardView<T extends object>(props: CardViewProps<T>, ref: DOMRef<HTMLDivElement>) {
@@ -242,14 +248,14 @@ export const CardView = /*#__PURE__*/ (forwardRef as forwardRefType)(function Ca
               defaultSelectedKeys={undefined}
               onSelectionChange={onSelectionChange}
               style={{
-                ...UNSAFE_style,
+                ...(!props.renderActionBar ? UNSAFE_style : {}),
                 // Add padding at the bottom when the action bar is visible so users can scroll to the last items.
                 // Also add scroll padding so keyboard navigating preserves the padding.
                 paddingBottom: actionBarHeight > 0 ? actionBarHeight + options.minSpace.height : 0,
                 scrollPadding: options.minSpace.height,
                 scrollPaddingBottom: actionBarHeight + options.minSpace.height
               }}
-              className={renderProps => UNSAFE_className + cardViewStyles({...renderProps, isLoading: props.loadingState === 'loading'}, styles)}>
+              className={renderProps => (!props.renderActionBar ? UNSAFE_className : '') + cardViewStyles({...renderProps, isLoading: props.loadingState === 'loading'}, !props.renderActionBar ? styles : undefined)}>
               {children}
             </AriaGridList>
           </ImageCoordinator>
@@ -262,7 +268,7 @@ export const CardView = /*#__PURE__*/ (forwardRef as forwardRefType)(function Ca
   // ActionBar cannot be inside the GridList due to ARIA and focus management requirements.
   if (props.renderActionBar) {
     return (
-      <div ref={domRef} className={style({position: 'relative', overflow: 'clip', size: 'fit'})}>
+      <div ref={domRef} className={UNSAFE_className + wrapperStyles(null, styles)} style={UNSAFE_style}>
         {cardView}
         {actionBar}
       </div>