diff --git a/core/src/components/virtual-scroll/test/basic/e2e.ts b/core/src/components/virtual-scroll/test/basic/e2e.ts
new file mode 100644
index 0000000000..d4984217a7
--- /dev/null
+++ b/core/src/components/virtual-scroll/test/basic/e2e.ts
@@ -0,0 +1,11 @@
+import { newE2EPage } from '@stencil/core/testing';
+
+test('virtual-scroll: basic', async () => {
+  const page = await newE2EPage({
+    url: '/src/components/virtual-scroll/test/basic?ionic:_testing=true'
+  });
+  await page.waitFor(300);
+
+  const compare = await page.compareScreenshot();
+  expect(compare).toMatchScreenshot();
+});
diff --git a/core/src/components/virtual-scroll/test/cards/e2e.ts b/core/src/components/virtual-scroll/test/cards/e2e.ts
new file mode 100644
index 0000000000..0aeac0adc2
--- /dev/null
+++ b/core/src/components/virtual-scroll/test/cards/e2e.ts
@@ -0,0 +1,11 @@
+import { newE2EPage } from '@stencil/core/testing';
+
+test('virtual-scroll: cards', async () => {
+  const page = await newE2EPage({
+    url: '/src/components/virtual-scroll/test/cards?ionic:_testing=true'
+  });
+  await page.waitFor(300);
+
+  const compare = await page.compareScreenshot();
+  expect(compare).toMatchScreenshot();
+});
diff --git a/core/src/components/virtual-scroll/test/cards/index.html b/core/src/components/virtual-scroll/test/cards/index.html
index 04df59682e..ab7699eb61 100644
--- a/core/src/components/virtual-scroll/test/cards/index.html
+++ b/core/src/components/virtual-scroll/test/cards/index.html
@@ -62,7 +62,7 @@
     }
 
     virtual.nodeRender = (el, cell) => {
-      if (cell.type === 0) return renderItem(el, cell.value);
+      if (cell.type === 'item') return renderItem(el, cell.value);
       return renderHeader(el, cell.value);
     };
     const lorem = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.';
diff --git a/core/src/components/virtual-scroll/virtual-scroll.scss b/core/src/components/virtual-scroll/virtual-scroll.scss
index 14316189a6..df56ac21e3 100644
--- a/core/src/components/virtual-scroll/virtual-scroll.scss
+++ b/core/src/components/virtual-scroll/virtual-scroll.scss
@@ -11,14 +11,17 @@ ion-virtual-scroll {
   user-select: none;
 }
 
-.virtual-loading {
+ion-virtual-scroll > .virtual-loading {
   opacity: 0;
 }
 
-.virtual-item {
-  @include position(0, 0, null, 0);
+ion-virtual-scroll > .virtual-item {
+  /* stylelint-disable declaration-no-important, property-blacklist */
+  position: absolute !important;
 
-  position: absolute;
+  top: 0 !important;
+  right: 0 !important;
+  left: 0 !important;
 
   transition-duration: 0ms;
   will-change: transform;