HTML Position


<html>
    <head>
       <style>
        .static {
            position: static;
            left: 10px;
            bottom: 10px;
            background-color: yellow;
            padding: 10px;
        }

        .relative {
            position: relative;
            left: 10px;
            bottom: 10px;
            background-color: yellow;
            padding: 10px;
        }

        .absolute {
            position: absolute;
            left: 10px;
            bottom: 10px;
            background-color: yellow;
            padding: 10px;
        }

        .genitore-assoluto{
            position: relative;
            height: 100px;
            padding: 10px;
            background-color: #81adc8;
        }


        .fixed {
            position: fixed;
            bottom: 10px;
            left: 10px;
            background-color: yellow;
            padding: 10px;
        }


        .figlio {
            padding: 10px;
            background-color: #f2f2f2;
        }
       </style>
    </head>
    <body>
        <div class=""> <!-- mettere qui genitore-assoluto per gli ultimi due stily -->
            <div class="figlio">
                Elemento figlio.
            </div>

            <div class=""> <!-- Sostituire qui gli stili -->
                Elemento principale.
            </div>

            <div class="figlio">
                Altro elemento figlio.
            </div>
        </div>
    </body>
<html>