title: How to offset for scrollbar width with css?
body: <p>I had to set these properties and make my scrollbar appear on top of the page because it was making my lightbox jitter when I clicked on an image.</p>
  <pre><code>html {
   overflow-y: scroll;
   overflow-y: overlay;
  }
  </code></pre>
  <p>However on mobile this makes it seem like I have no margin on the right as it appears behind the scrollbar.</p>
  <p>Is there a way that I can offset my content on the right to match the scrollbars width, while still keeping it on top of everything?</p>
  <p><a href="https://i.stack.imgur.com/CFZAa.png" rel="nofollow noreferrer">A screenshot of the issue</a></p>
  <p>The container the images are inside has 4% margin on the left and right but the scrollbar is displaying over it on the right.</p>