Validating
Helpful hints on what went wrong
Validating
- The CSS validator works just like the HTML validator
- Validate each of the activities on this page using the W3 CSS Validator
- Fix the validation error
- Explain what was wrong with the code in the study guide
Validating Activity 1
@import url(https://fonts.googleapis.com/css?family=Libre+Baskerville);
body{
font-family: 'Libre Baskerville', serif;
font-size: 0.8em;
}
h1, h2, h3, h4, h5, h6{
font-family: 'Arial Black', Gadget, sans-serif;
color: rgb(63, 63, 63);
}
header a:link{
color: f8fec5;
text-decoration: none;
}
header a:visited{
color: #f8fec5;
text-decoration: none;
}
header a:hover{
color: #f2cc0f;
text-decoration: none;
}
header a:active{
color: #ffffff;
text-decoration: none;
}
a:link{
color: #f8fec5;
text-decoration: underline;
}
a:visited{
color: #f8fec5;
text-decoration: none;
}
a:hover{
color: #f2cc0f;
text-decoration: none;
}
a:active{
color: #ffffff;
text-decoration: none;
}
.blurb{
background-color: yellow;
}
.author{
text-transform: uppercase;
}
#production-section p{
color: green;
}
li>a{
color: red;
}
Validating Activity 2
@import url(https://fonts.googleapis.com/css?family=Libre+Baskerville);
body{
font-family: 'Libre Baskerville', serif;
font-size: 0.8em;
}
header a:link{
color: #f8fec5;
text-decoration: none;
}
header a:visited{
color: #f8fec5;
text-decoration: none;
}
h1, h2, h3, h4, h5, h6{
font-family: 'Arial Black', Gadget, sans-serif;
color: rgb(63, 63, 63);
}
header a:hover{
color: #f2cc0f;
text-decoration: none;
}
header a:active{
color: #ffffff;
text-decoration: none;
}
.blurb{
background-color: yellow;
}
.author{
text-transform: uppercase;
}
#production-section p{
color: green;
li>a{
color: red;
}
a:link{
color: #f8fec5;
text-decoration: underline;
}
a:visited{
color: #f8fec5;
text-decoration: none;
}
a:hover{
color: #f2cc0f;
text-decoration: none;
}
a:active{
color: #ffffff;
text-decoration: none;
}
Validating Activity 3
@import url(https://fonts.googleapis.com/css?family=Libre+Baskerville);
body{
font-family: 'Libre Baskerville', serif;
font-size: 0.8em;
}
h1, h2, h3, h4, h5, h6{
font-family: 'Arial Black', Gadget, sans-serif;
color: rgb(63, 63, 63);
}
#production-section p{
color: green;
}
li>a{
color: red;
}
a:link{
color: #f8fec5;
text-decoration: underline;
}
a:visted{
color: #f8fec5;
text-decoration: none;
}
a:hover{
color: #f2cc0f;
text-decoration: none;
}
a:active{
color: #ffffff;
text-decoration: none;
}
header a:link{
color: #f8fec5;
text-decoration: none;
}
header a:visited{
color: #f8fec5;
text-decoration: none;
}
header a:hover{
color: #f2cc0f;
text-decoration: none;
}
header a:active{
color: #ffffff;
text-decoration: none;
}
.blurb{
background-color: yellow;
}
.author{
text-transform: uppercase;
}
Validating Activity 4
@import url(https://fonts.googleapis.com/css?family=Libre+Baskerville);
body{
font-family: 'Libre Baskerville', serif;
font-size: 0.8em;
}
header a:link{
color: #f8fec5;
text-decoration: none;
}
header a:visited{
color: #f8fec5;
text-decoration: none;
}
header a:hover{
color: #f2cc0f;
text-decoration: none;
}
header a:active{
color: #ffffff;
text-decoration: none;
}
.blurb{
background-color yellow;
}
.author{
text-transform: uppercase;
}
h1, h2, h3, h4, h5, h6{
font-family: 'Arial Black', Gadget, sans-serif;
color: rgb(63, 63, 63);
}
#production-section p{
color: green;
}
li>a{
color: red;
}
a:link{
color: #f8fec5;
text-decoration: underline;
}
a:visited{
color: #f8fec5;
text-decoration: none;
}
a:hover{
color: #f2cc0f;
text-decoration: none;
}
a:active{
color: #ffffff;
text-decoration: none;
}
Validating Activity 5
@import url(https://fonts.googleapis.com/css?family=Libre+Baskerville);
header a:active{
color: #ffffff;
text-decoration: none;
}
.blurb{
background-color: yellow;
}
.author{
text-transform: uppercase;
}
h1, h2, h3, h4, h5, h6{
font-family: 'Arial Black', Gadget, sans-serif
color: rgb(63, 63, 63);
}
#production-section p{
color: green;
}
li>a{
color: red;
}
a:link{
color: #f8fec5;
text-decoration: underline;
}
a:visited{
color: #f8fec5;
text-decoration: none;
}
a:hover{
color: #f2cc0f;
text-decoration: none;
}
a:active{
color: #ffffff;
text-decoration: none;
}
body{
font-family: 'Libre Baskerville', serif;
font-size: 0.8em;
}
header a:link{
color: #f8fec5;
text-decoration: none;
}
header a:visited{
color: #f8fec5;
text-decoration: none;
}
header a:hover{
color: #f2cc0f;
text-decoration: none;
}