How to make same size with all browsers

I made a webapplication but it just works correct on google chrome.When I try to run on Microsoft Edge it doesnt work correctly.Boxes have different height and weight on microsoft edge.You can check images and my CSS code below.How can I make it correct for all web browsers?

Google Chrome Microsoft Edge

   

 html, body { margin: 0; height: 100%;   background-color: black;} 
    .grid-container * { }
    .grid-container div:after 
    {  
      content: ''; color: #888; 
      display: flex; justify-content: center; 
      align-items: center; height: 100%; font-family: arial;
        background-color: #2A2A2A;
    }
    .grid-container 
    {   padding:5px;
        height:100%;
        width:1890px;
        display: grid;    
        grid-template-columns: 0.5fr 1.25fr 1.25fr 1.25fr 1.25fr 1.25fr 1.25fr; 
       grid-template-rows: 0.25fr 1fr 1fr 1fr 1fr;  grid-gap: 10px 10px;
       background-color: black;  
       grid-template-areas: 
           'Header Header Header Header Header Header Header' 
           'Menu Box1 Box1 Box2 Box2 Box3 Box4' 'Menu Box5 Box5 Box6 Box6 Box6 Box7' 
           'Menu Box5 Box5 Box6 Box6 Box6 Box8' 'Menu Box9 Box10 Box11 Box12 Box13 Box14'
           ;}
    .btn-group button {
        background-color: #1F1F1F; /* Green background */
        border: 1px solid black; /* Green border */
        color: white; /* White text */
        padding: 10px 20px; /* Some padding */
        cursor: pointer; /* Pointer/hand icon */
    }
    img {
        border-radius: 4px;
        width: 100px;
       }
    .btn-group:after {
        content: "";
        clear: both;
        display: table;
    }
    .btn-group button:not(:last-child) {
        border-right: none; /* Prevent double borders */
    }

    .btn-group button:hover {
        background-color: #335280;
    }
    .btn-group button:focus {
        background-color: #335280;
    }

    .Header { grid-area: Header; }
    .Menu { grid-area: Menu; 
         height:0px;
    }
    .Box1 { grid-area: Box1;}
    .Box2 { grid-area: Box2;
            
      }
    .Box3 { grid-area: Box3;
            }
    .Box4 { 
         background: #2a2a2a;
        grid-area: Box4;
    }
    .Box5 { grid-area: Box5; 
         height:0px;
              width:0px;
    }
    .Box6 { grid-area: Box6; 
             
    }
    .Box7 { grid-area: Box7; }
    .Box8 { grid-area: Box8; }
    .Box9 { grid-area: Box9; }
    .Box10 { grid-area: Box10; }
    .Box11 { grid-area: Box11; }
    .Box12 { grid-area: Box12; }
    .Box13 { grid-area: Box13; }
    .Box14 { grid-area: Box14; }
    #chart {
          height: 100%;       
    }
    .dx-viewport
    {
      background-color: #2A2A2A;
    }
    #gauge {
        height: 100%;
    }
    #gaugeContainer {
        height: 100%;
    }
    .foo {
      float: left;
      width: 0px;
      height: 70px;
      margin: 10px;
      margin-bottom:20px;
    }
    .blue {
      background: #5c5c5c;
    }
    .value {
            margin-left:30px;
            font-size: 45px;
            color: white;
    }
    .value2 {
            margin-left:25px;
            font-size: 17px;
            color: #5c5c5c;
    }
    .value3{
            margin-left:30px;
            margin-top:12px;
            font-size: 20px;
            color: white;
    }
    .value4 {
            margin-left:25px;
            font-size: 17px;
            color: #5c5c5c;
            margin-bottom:25px;
    }
    .inner-grid {
      display: grid;
      grid-template-columns:1fr ;
      grid-gap: 10px;
      
    }
    .inner-grid > div {
      padding: 8px;
        margin-top:0px;

    }
    .title{
        font-size: 20px;
        color: white;
    }
    .btn-group2 button {
        background-color: #2A2A2A;
        border: 0px solid green; /* Green border */
        color: white; /* White text */
        padding: 20px; /* Some padding */
        font-size: 30px;
        height:102px;
        cursor: pointer; /* Pointer/hand icon */
        float: left; /* Float the buttons side by side */
    }

    /* Clear floats (clearfix hack) */
    .btn-group2:after {
        content: "";
        clear: both;
        display: table;
    }

    .btn-group2 button:not(:last-child) {
        border-right: none; /* Prevent double borders */
    }

    /* Add a background color on hover */
    .btn-group2 button:hover {
        background-color: #3e8e41;
    }