From 43486022445ffa1372bff2c59190d1d0c0259ce1 Mon Sep 17 00:00:00 2001
From: Kostia <74874576+Wordllban@users.noreply.github.com>
Date: Fri, 25 Oct 2024 23:06:44 +0300
Subject: [PATCH] docs: extend scrollMargin description

---
 docs/api/virtualizer.md | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/docs/api/virtualizer.md b/docs/api/virtualizer.md
index bf407779..ffa51478 100644
--- a/docs/api/virtualizer.md
+++ b/docs/api/virtualizer.md
@@ -206,7 +206,13 @@ This optional function is called when the virtualizer needs to dynamically measu
 scrollMargin?: number
 ```
 
-With this option, you can specify where the scroll offset should originate. Typically, this value represents the space between the beginning of the scrolling element and the start of the list. This is especially useful in common scenarios such as when you have a header preceding a window virtualizer or when multiple virtualizers are utilized within a single scrolling element.
+With this option, you can specify where the scroll offset should originate. Typically, this value represents the space between the beginning of the scrolling element and the start of the list. This is especially useful in common scenarios such as when you have a header preceding a window virtualizer or when multiple virtualizers are utilized within a single scrolling element. If you are using absolute positioning of elements, you should take into account the `scrollMargin` in your CSS transform:
+```tsx
+transform: `translateY(${
+   virtualRow.start - rowVirtualizer.options.scrollMargin
+}px)` 
+``` 
+To dynamically measure value for `scrollMargin` you can use `getBoundingClientRect()` or ResizeObserver. This is helpful in scenarios when items above your virtual list might change their height.   
 
 ### `gap`