scrimba
Frontend Career Path
Web dev basics
Build a Space Exploration site
Improving the readability with text shadows
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

Improving the readability with text shadows
AboutCommentsNotes
Improving the readability with text shadows
Expand for more info
styles.css
run
preview
console
body {
margin: 0;
color: #82a5ca;
text-align: center;
font-family: 'Orbitron', sans-serif;
}

#hero {
background-image: url("images/galaxy.webp");
background-size: cover;
padding: 10px 0 40px 0;
}

#main-logo {
width: 100px;
}

/*
Challenge:
Add a blurred border around the <h1> using
the text-shadow technique you just learned. Set
the blur to 4px and the color to black.
*/

.btn {
padding: 6px 12px;
background: white;
border: none;
font-family: 'Orbitron', sans-serif;
color: #82a5ca;
font-weight: 800;
}

.underline {
border-bottom: 4px solid white;
}
Console
/index.html
-1:57