PageEditor.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Page Developer</title>

        <style>
            .content {
                background-image: linear-gradient(to right,#EFB7DF, #F280D1,  #AF6599, #F280D1, #EFB7DF);
                margin-top: -0.2cm;
                margin-left: -0.5cm;
                margin-bottom: 0cm;
                margin-right: -0.2cm;
                height: 16.3cm;
                color: white;
                text-align: center;
                font-family: Arial, Helvetica, sans-serif;
                font-size: 15px;
            }
            img {
                margin-left: -10cm;
                margin-top: 1cm;
            }
            .details {
                margin-top: -10cm;
                margin-left: 16.2cm;
                background-color: #FAC7EB ;
                color: black;
                height: 10cm;
                width: 10cm;
            }
        </style>
    </head>
    <body>
        <div class="content">
            <br>
            <div><h1>Thashi Maleesa Godahewa</h1></div>
            <img class="mypic" src="mypic.jpeg" alt="pic" style="width:6cm; height: 10cm;">
            <div class="details">
                <br>
                <p>Role : Student 2</p>
                <p>IIT ID : 20201030</p>
                <p>UoW ID : w1840234</p><br>
                <p><u>Tasks Completed</u></p>
                <p>main page</p>
                <p>Query Form</p>
                <p>External Style Sheet</p>
                <p>Navigation Bar</p>
            </div>
        </div>
    </body>
</html>