Prevent the HTML page from resizing

Question

I'm trying to prevent the html page from moving, resizing while width page is under 1350 px.

Btw on my css code, for the width, height, transformation: translate, i'm using the value vmax , and not px or %. So the min-width maybe doesn't work with it, all of my elements keep resizing because they are using vmax, so they just adapt there size with the window size too.. :(

I tried this but this doesn't work too (I was trying to stop resizing the three white rectangle, tabcmp0, 1 and 2)

@media only screen and (max-width: 1350px) {
    #tabcmp0 {
        width: 370px;
    }
    #tabcmp1 {
        width: 370px;
    }
    #tabcmp2 {
        width: 370px;
    }
    body {
        max-width: 1350px;
    }
}

Code + preview

See this page for exemple , when she is less than some px, the page stop from resizing and a scroll bar appear, i want the same result but i don't know how to do it ...

Answer 1

i think there is no choice to return px model if you want to create a static content there.

@media only screen and (max-width: 1350px) {
  #tabcmp0 {
      width: 370px;
      height:580px;
      left:210px;
  }
  #tabcmp1 {
    width: 370px;
    height:580px;
    left:590px;
  }
  #tabcmp2 {
    width: 370px;
    height:580px;
   left:980px;
  }
  .select_dev {
    width:202.5px;
  }
  body {
    max-width: 1350px;
  }
}

i think you should give all exact px values instead of dynamic vmax values like that for each element like headers, left menu etc...