Drag the edges to resize the window.

Code Editor
Web Browser
Sustainable SCSS


Sometimes, you may create classes solely for the purpose of extending them and never actually use them inside your HTML.

Sass anticipated this and allows for a special type of selector called a placeholder, which behaves just like a class or id selector, but use the % notation instead of # or .

Placeholders prevent rules from being rendered to CSS on their own and only become active once they are extended anywhere an id or class could be extended.

a%drink { font-size: 2em; background-color: $lemon-yellow; } .lemonade { @extend %drink; //more rules }

would translate to

a.lemonade { font-size: 2em; background-color: $lemon-yellow; } .lemonade { //more rules }

Placeholders are a nice way to consolidate rules that never actually get used on their own in the HTML.

Community Forums
Get help and ask questions in the Codecademy Forums
Report a Bug
If you see a bug or any other issue with this page, please report it here.