[BUG] Apply a Style Until a Condition is Met with @while

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

I am using the latest version of Chrome, in fact I checked in all 3 browsers (Chrome/Firefox/IE)…

I don’t know why, when i tried $x <= 10 it worked for me but $x < 11 is not working, but its differing for many people. It does not make sense.

I tried Both methods & got same result = not pass