盒子水平垂直居中问题

     .parent{
            width:200px;
            height:200px;
            border: 1px solid #000;
            display: flex;/*flex布局*/
            align-items: center;
            justify-content: center;
        }
        .parent2{
            width:200px;
            height:200px;
            display: table-cell;/*table布局*/
            vertical-align:middle;
            text-align:center;
            border: 1px solid #000;
        }
        .child2{
            display: inline-block;
        }
        .parent3{
            width:200px;
            height:200px;
            position: relative;
            border: 1px solid #000;
        }
        .child3{
            position: absolute;
            top:50%;
            left:50%;
            transform: translate(-50%,-50%);
        }

    
123


    
123


    
123