关于grid介绍参考：http://itssh.cn/post/940.html

使用grid实现左右布局案例：

<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
        <title>CSS Grid 布局之左右两栏布局案例</title>
        <!--
            @author:SM
            @email:sm0210@qq.com
            @desc:CSS Grid 布局之左右两栏布局案例
         -->
        <!-- 自定义css -->
        <style type="text/css">
            * {
                margin: 0;
                padding: 0;
            }
            
            /*
                公共
            */
            .box,
            .contentInfo,
            .box_left,
            .copyright {
                display: grid;
            }
            
            /*
                box
            */
            .box {
                grid-row-gap: 10px;
                color: #fff;
            }
            /*
                
            */
            .contentInfo,
            .copyright {
                grid-template-columns: 200px 1fr;
                grid-column-gap: 10px;
                grid-template-rows: 400px;
            }
            
            /*
                
            */
            .copyright {
                grid-template-rows: 60px;
            }
            /*
                
            */          
            .box_left {
                grid-template-rows: 40px 1fr;
                grid-row-gap: 10px;
            }
            
            /*
                
            */
            .title,
            .stats,
            .box_right,
            .score,
            .controls {
                background-color: #7AB8ED;
            }
        </style>
    </head>
    <body>
    
        <!-- css grid布局 -->
        <div class="box">
            <div class="contentInfo">
                <div class="box_left">
                    <div class="title">Title</div>
                    <div class="stats">Stats</div>
                </div>
                <div class="box_right">Content</div>
            </div>
            
            <!--  -->
            <div class="copyright">
                <div class="score">
                    Score
                </div>
                <div class="controls">Controls</div>
            </div>
        </div>
        
    </body>
</html>