Skip to content

Instantly share code, notes, and snippets.

@gsrai
Created June 1, 2022 19:44
Show Gist options
  • Save gsrai/cf5c97cac67105a5e81e5fdfad76928f to your computer and use it in GitHub Desktop.
Save gsrai/cf5c97cac67105a5e81e5fdfad76928f to your computer and use it in GitHub Desktop.

Revisions

  1. gsrai created this gist Jun 1, 2022.
    27 changes: 27 additions & 0 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,27 @@
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>center a div</title>
    <style>
    .container {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    }

    .content {
    max-width: 200px;
    max-height: 200px;
    }
    </style>
    </head>
    <body>
    <div class="container">
    <!-- just imagine this is a div -->
    <img class="content" src="https://picsum.photos/200" />
    </div>
    </body>
    </html>