scrimba
Tailwind
Block Gallery Challenge
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

Block Gallery Challenge
AboutCommentsNotes
Block Gallery Challenge
Expand for more info
index.html
run
preview
console
<html>
<head>
<link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet">
</head>
<body>
<!-- Must take up all of the available space -->
<!-- Evenly distributed 3x3 grid -->
<!-- Letters must be centered on the square -->
<!-- Must have some spacing between the blocks -->
<div class="">
<div class="bg-teal-100">A</div>
<div class="bg-teal-200">B</div>
<div class="bg-teal-300">C</div>
<div class="bg-teal-400">D</div>
<div class="bg-teal-500">E</div>
<div class="bg-teal-600">F</div>
<div class="bg-teal-700">G</div>
<div class="bg-teal-800">H</div>
<div class="bg-teal-900">I</div>
</div>
</body>
</html>
Console
/index.html
-6:01