scrimba
UI Design
Responsive Design
Mobile First CSS (Part 2)
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

Mobile First CSS (Part 2)
AboutCommentsNotes
Mobile First CSS (Part 2)
Expand for more info
index.css
run
preview
console
@import url('https://fonts.googleapis.com/css?family=Nunito:400,700&display=swap');

html, body {
margin: 0;
padding: 0;
}

body {
font-family: 'Nunito', sans-serif;
}

.wrapper {
padding: 1em;
}

a {
text-decoration: none;
}

img {
width: 100%;
}

a.logo {
color: #C500FF;
font-weight: bold;
font-size: 1.2em;
}

ul {
list-style-type: none;
margin: 0;
padding: 0;
}
nav ul {
display: flex;
margin-top: 1em;
}

nav li {
margin-right: .5em;
}

nav li a {
color: black;
font-weight: bold;
padding: .3em .7em;
background-color: #E6E6E6;
border-radius: 1em;
}

/*

- White Space
- Color
- Contrast
- Scale
- Alignment
- Typography
- Visual Hierarchy

*/
Console
/index.html
-5:46