Bypass for Windows Display Scaling messing up with the vw units?

Question

I'm following a course for React and at some point the teacher is using vw units to set the width of a container for some cards. Everything looks good for him, but when i copy-paste the code into my css file, it's off. Even though I'm using 85vw, the cards go off screen.

I figure out that it's because I have a small laptop and a 2k display. In Windows Settings I have the scaling set to 200% and this messes everything up.

The problem gets solve when i do one of the following:

1. I set the display resolution to 1920x1200 (I have a 16:10 display)
2. I set the scale to 100%

Is there a way to bypass the this Windows scaling and make my website look good on all screens?

the CSS file:

.card-list {
  width: 85vw;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 20px;
}
.card-container {
  display: flex;
  flex-direction: column;
  background-color: #95dada;
  border: 1px solid grey;
  border-radius: 5px;
  padding: 25px;
  cursor: pointer;
  -moz-osx-font-smoothing: grayscale;
  backface-visibility: hidden;
  transform: translateZ(0);
  transition: transform 0.25s ease-out;
}

.card-container:hover {
  transform: scale(1.05);
}