Name: Solution - Github Profile Layout
Uploaded: 2023-03-02T20:59:21.818Z
Duration: 5 min 24 s
Description: Solution - Github Profile Layout

scrimba

Watch in fullscreen

Solution - Github Profile Layout

by Treasure Porth

CSS Challenges

About

Comments

Notes

Challenge - Toggle Switch2:42

Solution - Github Profile Layout

by Treasure Porth

CSS Challenges

Expand for more info

Challenge - Toggle Switch2:42

index.html

run

preview

console

<!doctype html>
<html> 
    <head>
        <title></title>
        <link rel="preconnect" href="https://fonts.googleapis.com">
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <link href="https://fonts.googleapis.com/css2?family=Noto+Sans:wght@300;600&display=swap" rel="stylesheet">
        <link rel="stylesheet" href="index.css">
    </head>
    <body> 
        <div class="profile-container">
            <div class="profile-content">
                <img alt="" src="florian-olivo-unsplash.jpg"/>
                <div class="profile-details">
                    <h2>Scrimton Scrimsby</h2>
                    <h3>scrimsallday3000</h3>
                    <p>I'm the world's most prolific Fortran dev. </p>
                    <button type="button">Edit Profile</button>
                </div>
            </div>
        </div>
    </body>
</html>

<!doctype html>

<html>

<head>

rel="stylesheet">

</head>

<body>

<h2>Scrimton Scrimsby</h2>

<h3>scrimsallday3000</h3>

<p>I'm the world's most prolific Fortran dev. </p>

<button type="button">Edit Profile</button>

</div>

</body>

</html>

-5:24