SASS Lesson 6 not working

https://www.codecademy.com/courses/learn-sass/lessons/hello-sass/exercises/variables?action=lesson_resume

Error Message:
Did you add a background-color property of .slogan class in main.scss?


@import url(https://fonts.googleapis.com/css?family=Pacifico);
//Add variables here:
sass main.scss main.css

$translucent-white: rgba(255,255,255,0.3);

h1 {
  font-family: Roboto, sans-serif;
  text-align: center;
}

.banner {
  font-family: 'Pacifico', cursive;
  height: 400px;
  background-image: url("lemonade.jpg");
  border : {
    top: 4px solid black;
    bottom: 4px solid black;
}
    .slogan {
    background-color: $translucent-white;
    position: absolute;
    border: 4px solid black;
    top: 200px;
    left: 25%;
    width: 50%;
    height: 200px;
    text-align: center;
      span {
      font-size: 24px;
      line-height: 200px;
		}
  }
}

.container {
  text-align: center;
  font-family: 'Pacifico', cursive;
  	.icon {
    display: inline-block;
    margin: 2%;
    border: 4px solid black;
    font-size: 32px;
  }
}


I hope like more people have the same problem it can be helped.

You’ve placed .slogan inside .banner

yes that was because i needed to nest everything in the previous lessons. but ill try and change that! thank you.

@import url(https://fonts.googleapis.com/css?family=Pacifico);
//Add variables here:
sass main.scss main.css

$translucent-white: rgba(255,255,255,0.3);

h1 {
font-family: Roboto, sans-serif;
text-align: center;
}

.slogan {
background-color: $translucent-white;
position: absolute;
border: 4px solid black;
top: 200px;
left: 25%;
width: 50%;
height: 200px;
text-align: center;
span {
font-size: 24px;
line-height: 200px;
}
}

.banner {
font-family: ā€˜Pacifico’, cursive;
height: 400px;
background-image: url(ā€œlemonade.jpgā€);
border : {
top: 4px solid black;
bottom: 4px solid black;
}
}

.container {
text-align: center;
font-family: ā€˜Pacifico’, cursive;
.icon {
display: inline-block;
margin: 2%;
border: 4px solid black;
font-size: 32px;
}
}

Changed the code but still not working what am i doing wrong?

Dunno, the background is applied when I run it locally (for both your versions), and the only thing that the exercise webpage is telling me is that it itself is a buggy pile of …

I think they give you the ā€œsolutionā€ if you unsuccessfully submit some amount of times in a row? I’d jump ship and find a ā€œgetting startedā€ tutorial that I could do in my own environment

What about this line?

sass main.scss main.css

I don’t know any sass but… that looks more like it belongs on the command line than in the file itself.
If it isn’t compiled successfully then codecademy should be saying so, not hiding it while blaming your code. ew.

Yes the give Code button didn’t work eather but i fixed it because of your sharpness indeed the commandline thingy was removed and then it worked… didn’t see it there i guese ctrl v the wrong thing xD. thank alot m8

1 Like

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