在不改变html结构的情况下，写出至少7种方法实现以下布局。

[LuckyWinty]

在不改变以下html结构的情况下，写出至少7种方法实现 child1，child2 靠左，中间自适应，child3靠右 的布局

    <div class="parent" style="width: 200px">
        <div class="child child1" style="width: 20px"></div>
        <div class="child child2" style="width: 20px">2</div>
        <div class="child child3" style="width: 20px">3</div>
    </div>

[LuckyWinty]

/* 1 */
    .parent{
        background-color: burlywood;
        display: flex;
    }
    .child{
        background-color: black;
        font-size: 20px;
        color: white;
    }
    .child3{
        margin-left: auto;
    }

/* 2 */
    .parent{
        background-color: burlywood;
        position: relative;
    }
    .child{
        font-size: 20px;
        color: white;
    }
    .child1{
        background-color: black;
        position: absolute;
        left: 0;
    }
    .child2{
        background-color: black;
        position: absolute;
        left: 20px;
    }
    .child3{
        background-color: black;
        position: absolute;
        right: 0;
    }

/* 3 */
    .parent{
        background-color: burlywood;
    }
    .child1{
        background-color: black;
        float: left;
    }
    .child2{
        background-color: red;
        float: left;
    }
    .child3{
        float: right;
        background-color: blue
    }

/* 4 */
    .parent{
        background-color: burlywood;
        display: table;
    }
    .child{
        background-color: black;
        display: table-cell;
        height: 20px;
    }
    .child3{
        display: block;
        margin-left: auto;
    }

/* 5 */
    .parent{
        background-color: burlywood;
        position: relative;
    }
    .child{
        background-color: black;
        position: absolute;
        top:0;
        left:0;
    }
    .child2{
        transform: translate(20px, 0);
    }
    .child3{
        transform: translate(180px, 0);
    }

/* 6 */
  .parent{
        background-color: burlywood;
        display: grid;
        grid-template-columns: repeat(10, 1fr);
    }
    .child{
        background-color: black;
        font-size: 20px;
        color:white;
    }
    .child3{
        grid-column: 10 / 11;
    }

/* 7 */
    .parent{
        background-color: burlywood;
        font-size: 0;
    }
    .child{
        background-color: black;
        display: inline-block;
        font-size: 20px;
        color: white;
    }
    .child3{
        margin-left: 140px;
    }