diff --git a/src/app/components/scroller/scroller.ts b/src/app/components/scroller/scroller.ts
index b7e706533cc..2f6f7005f15 100644
--- a/src/app/components/scroller/scroller.ts
+++ b/src/app/components/scroller/scroller.ts
@@ -866,15 +866,18 @@ export class Scroller implements OnInit, AfterContentInit, AfterViewChecked, OnD
     }
 
     setSpacerSize() {
-        if (this._scrollHeight !== '100%' && this._items) {
+        if (this._items) {
             const contentPos = this.getContentPosition();
-            const setProp = (_name: string, _value: any, _size: number, _cpos: number = 0) => (this.spacerStyle = { ...this.spacerStyle, ...{ [`${_name}`]: (_value || []).length * _size + _cpos + 'px' } });
+            const setProp = (_name, _count, _size, _cpos = 0) => (this.spacerStyle = { ...this.spacerStyle, ...{[`${_name}`]: _count * _size + _cpos + 'px' }});
 
+            const { numItemsInViewport, numToleratedItems } = this.calculateNumItems();
+            const numHiddenItems = Math.max(0, this._items.length - numItemsInViewport - numToleratedItems);
             if (this.both) {
-                setProp('height', this._items, (<number[]>this._itemSize)[0], contentPos.y);
-                setProp('width', this._columns || this._items[1], (<number[]>this._itemSize)[1], contentPos.x);
-            } else {
-                this.horizontal ? setProp('width', this._columns || this._items, <number>this._itemSize, contentPos.x) : setProp('height', this._items, <number>this._itemSize, contentPos.y);
+                setProp('height', numHiddenItems, this._itemSize[0], contentPos.y);
+                setProp('width', this._columns?.length || this._items[1]?.length, this._itemSize[1], contentPos.x);
+            }
+            else {
+                this.horizontal ? setProp('width', this._columns.length || this._items.length, this._itemSize, contentPos.x) : setProp('height', numHiddenItems, this._itemSize, contentPos.y);
             }
         }
     }