8/10 part3


#1


https://www.codecademy.com/en/courses/make-a-website/lessons/closer-look-css/exercises/background-image

i cant figure out how to change the color of the text in class selector .hero without the image going white. there is not error message

body {
	height: 100%;
	margin: 0;
	text-align: center;
	width: 100%;
}

h1 {
	font-size: 32px;
  font-family: Palatino, 'Palatino Linotype', serif;
  color: rgb(121,149,117);
}

h2 {
	font-size: 56px;
}


.hero {
  background-image:
    url("https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-2/bg.jpg");
  background-size: cover;
  font-family:'Trebuchet MS', Helvetica, sans-serif;
	padding: 250px 0;
	margin: 30px;
}


p {
  font-size: 2rem

}

.hero a {
	color: #00FFAA;
	font-size: 1.25em;
	text-decoration: none;
}


#2

add color property set it to white in .hero selector

.hero {
  color:white;
}

#3

the problem was that i was putting in color:#ffffff; instead of color: #ffffff;
the space made all the difference


#4

Whitespace doesn't matter
.hero{color:#ffffff}
Is the exact same as:

.hero            {
      color       :      #ffffff

}

You do need spaces in selectors to make decendent selectors (e.g. .hero a { } is absolutely not the same as .heroa{ })


#5

This topic was automatically closed after 7 days. New replies are no longer allowed.