scrimba
Frontend Career Path
Essential CSS concepts
Build an NFT Site
Aside: Buttons/Links
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

AboutCommentsNotes
Aside: Buttons/Links
Expand for more info
index.css
run
preview
console
body{
color: whitesmoke;
font-family: 'Roboto', sans-serif;
letter-spacing: .45px
}

h2{
margin-top: 0;
font-size: 28px;
color: #d43435;
}

p{
font-size: 14px;
margin: 0;
}

/*
Challenge:
1. Change the buttons to links.
2. Style them like buttons so they
look the same. (you can re-use
most of the CSS!)
⚠️ This will cause a layout issue!
*/

button{
padding: 10px 19px;
border-radius: 4px;
background-color: #fff200;
background-color: gold;
font-size: 14px;
cursor: pointer;
color: #1d1e22;
border: none;
margin-top: 20px
}

.ad-container{
border: 1px solid darkgoldenrod;
padding: 20px 50px;
width: 560px;
height: 200px;
background-color: #1d1e22;
background-image: url('images/ferrari2.png');
background-repeat: no-repeat;
background-position: 0%;
margin: 50px auto;
}

.text-container{
width: 290px;
margin: 30px 0 0 310px;
}
Console
/index.html
-3:21