c9a4c901d4
* Guide: added solution @while sass Added proper Solution to the Guide for the problem Apply a Style Until a Condition is Met with @while, this is no longer a stub * fix: used 2-space indentation and removed verbiage * Removed images with broken links * Added back the images previously removed.
3.3 KiB
3.3 KiB
title
| title |
|---|
| Apply a Style Until a Condition is Met with @while |
Apply a Style Until a Condition is Met with @while
Remember to use Read-Search-Ask if you get stuck. Try to pair program 
and write your own code 
Problem Explanation:
This program is very simple, the trick is to remember how while looping works.
Hint: 0
- **Make sure your zoom settings are at
100%ordefaultotherwise tests sometimes fail. **
Hint: 1
- You will initialise the loop first with x as:
$x: 1
try to solve the problem now
Hint: 2
- See the example for
@whilesyntax,@while $x < 11
try to solve the problem now
Hint: 3
- to set class properties inside a loop we reference them enclosed by #{}, hence ere it will become:
.text-#{$x}
try to solve the problem now
Spoiler Alert!
Solution ahead!
Basic Code Solution:
$x: 1;
@while $x < 11 {
.text-#{$x} {
font-size: 5px * $x;
}
$x: $x + 1;
}
Relevant Links
NOTES FOR CONTRIBUTIONS:
DO NOT add solutions that are similar to any existing solutions. If you think it is similar but better, then try to merge (or replace) the existing similar solution.- Add an explanation of your solution.
- Categorize the solution in one of the following categories — Basic, Intermediate and Advanced.
