scrimba
HTML & CSS
Creating columns with flexbox
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Creating columns with flexbox
AboutCommentsNotes
Creating columns with flexbox
Expand for more info
index.html
run
preview
console
<html>
<head>
<title>Creating columns</title>
</head>
<body>
<header>
<h1>I'm learning HTML and CSS</h1>
</header>
<main>
<div class="intro">
<h2>HTML and CSS are the building blocks of the web</h2>
<p>Magna fringilla urna porttitor rhoncus dolor purus. Malesuada bibendum arcu vitae elementum. Purus sit amet volutpat consequat. </p>
</div>

<div class="my-skills">
<h2>I'm really good at a bunch of stuff!</h2>

<div class="columns">
<!-- column 1 -->
<div class="column">
<h3>HTML</h3>
<p>Magna fringilla urna porttitor rhoncus dolor purus. Malesuada bibendum arcu vitae elementum. Purus sit amet volutpat consequat. </p>
</div>

<!-- column 1 -->
<div class="column">
<h3>CSS</h3>
<p>Magna fringilla urna porttitor rhoncus dolor purus. Malesuada bibendum arcu vitae elementum. Purus sit amet volutpat consequat. </p>
</div>

<!-- column 1 -->
<div class="column">
<h3>And More!</h3>
<p>Magna fringilla urna porttitor rhoncus dolor purus. Malesuada bibendum arcu vitae elementum. Purus sit amet volutpat consequat. </p>
</div>

</div> <!-- columns -->
</div> <!-- / my-skills -->

</main>
</body>
</html>
Console
index.html
-7:03