Kolorwanie:
Status:
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
<html>
<head>
<title>HTML</title>    
<style>
    main {
        display: flex;
        flex-direction: column;
        width: 100%;
        outline: 1px blue solid;
    }
    .row {
        display: flex;
        flex-direction: row;
        flex-basis: 100%;
        flex-wrap: nowrap;
    }
    .cell {
        flex-grow: 1;
/*
        border: 1px solid red;
        margin: 1px;
*/
        height: 90px;
    }
    
    #a1, #b1, #c1, #d1, #b2, #a3, #b3, #c3, #d3,
    #a5, #a6, #a7, #b6, #c6, #d6,
    #a9, #b9, #c9, #d9, #b10, #c11, #b12, #a13, #b13, #c13, #d13,
    #a15, #b15, #c15, #d15, #d16, #d17{
        background-color: aqua;
    }
</style>
</head>
<body>
    <main>
        <div class="row">
            <div class="cell" id="a1"></div>
            <div class="cell" id="a2"></div>
            <div class="cell" id="a3"></div>
            <div class="cell" id="a4"></div>
            <div class="cell" id="a5"></div>
            <div class="cell" id="a6"></div>
            <div class="cell" id="a7"></div>
            <div class="cell" id="a8"></div>
            <div class="cell" id="a9"></div>
            <div class="cell" id="a10"></div>
            <div class="cell" id="a11"></div>
            <div class="cell" id="a12"></div>
            <div class="cell" id="a13"></div>
            <div class="cell" id="a14"></div>
            <div class="cell" id="a15"></div>
            <div class="cell" id="a16"></div>
            <div class="cell" id="a17"></div>
        </div>
    
        <div class="row">
            <div class="cell" id="b1"></div>
            <div class="cell" id="b2"></div>
            <div class="cell" id="b3"></div>
            <div class="cell" id="b4"></div>
            <div class="cell" id="b5"></div>
            <div class="cell" id="b6"></div>
            <div class="cell" id="b7"></div>
            <div class="cell" id="b8"></div>
            <div class="cell" id="b9"></div>
            <div class="cell" id="b10"></div>
            <div class="cell" id="b11"></div>
            <div class="cell" id="b12"></div>
            <div class="cell" id="b13"></div>
            <div class="cell" id="b14"></div>
            <div class="cell" id="b15"></div>
            <div class="cell" id="b16"></div>
            <div class="cell" id="b17"></div>
        </div>
        
        <div class="row">
            <div class="cell" id="c1"></div>
            <div class="cell" id="c2"></div>
            <div class="cell" id="c3"></div>
            <div class="cell" id="c4"></div>
            <div class="cell" id="c5"></div>
            <div class="cell" id="c6"></div>
            <div class="cell" id="c7"></div>
            <div class="cell" id="c8"></div>
            <div class="cell" id="c9"></div>
            <div class="cell" id="c10"></div>
            <div class="cell" id="c11"></div>
            <div class="cell" id="c12"></div>
            <div class="cell" id="c13"></div>
            <div class="cell" id="c14"></div>
            <div class="cell" id="c15"></div>
            <div class="cell" id="c16"></div>
            <div class="cell" id="c17"></div>
        </div>
        
        <div class="row">
            <div class="cell" id="d1"></div>
            <div class="cell" id="d2"></div>
            <div class="cell" id="d3"></div>
            <div class="cell" id="d4"></div>
            <div class="cell" id="d5"></div>
            <div class="cell" id="d6"></div>
            <div class="cell" id="d7"></div>
            <div class="cell" id="d8"></div>
            <div class="cell" id="d9"></div>
            <div class="cell" id="d10"></div>
            <div class="cell" id="d11"></div>
            <div class="cell" id="d12"></div>
            <div class="cell" id="d13"></div>
            <div class="cell" id="d14"></div>
            <div class="cell" id="d15"></div>
            <div class="cell" id="d16"></div>
            <div class="cell" id="d17"></div>
        </div>
    </main>
</body>
</html>

Copyrights 2014-2019 © Wklejaj.pl Wszelkie prawa zastrzeżone.