#container {
width: 300px;
height: 300px;
display: -ms-grid;
-ms-grid-columns: 25% 75%; /* 25% 75% 2 */
-ms-grid-rows : 50% 50%; /* 50% 50% 2 */
}
#box1 {
background-color: #ffaaaa;
-ms-grid-column: 1;
-ms-grid-row : 1;
}
#box2 {
background-color: #aaffaa;
-ms-grid-column: 2;
-ms-grid-row : 1;
}
#box3 {
background-color: #aaaaff;
-ms-grid-column : 1;
-ms-grid-row : 2;
-ms-grid-column-span: 2;
}
Box1 (25%)
Box2 (50%)
Box3 (50%+50%)