Tell us what’s happening:
Not passing test, because it says the .text class isn’t the correct size for each.
Each element is reporting that the sizes are correct for each element using inspect element, So I am at a loss…
Example:
.text-10 { font-size: 50; }
Your code so far
<style type='text/sass'>
$x: 1;
@while $x < 11 {
.text-#{$x} { font-size: $x * 5;}
$x: $x + 1;
}
</style>
<p class="text-1">Hello</p>
<p class="text-2">Hello</p>
<p class="text-3">Hello</p>
<p class="text-4">Hello</p>
<p class="text-5">Hello</p>
<p class="text-6">Hello</p>
<p class="text-7">Hello</p>
<p class="text-8">Hello</p>
<p class="text-9">Hello</p>
<p class="text-10">Hello</p>
// running test
Your .text-1 class should have a font-size of 5px.
Your .text-2 class should have a font-size of 10px.
Your .text-3 class should have a font-size of 15px.
Your .text-4 class should have a font-size of 20px.
Your .text-5 class should have a font-size of 25px.
Your .text-6 class should have a font-size of 30px.
Your .text-7 class should have a font-size of 35px.
Your .text-8 class should have a font-size of 40px.
Your .text-9 class should have a font-size of 45px.
Your .text-10 class should have a font-size of 50px.
// tests completed
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36
.
Link to the challenge:
https://learn.freecodecamp.org/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while