Issue Description

Thanks for the great work of freeCodeCamp.
The code editor is quite friendly with Tab key to auto complete some of the elements.
for example,when press tab in a style font. i got

<style>
    a{
     font : ;
   }
<\style>

but when it comes to style 'color'. i got

<style>
    a{
    column-rule: ;
   }
<\style>

so i think it would be inconvenient to change column-rule to color.

This is might an issue with Emmet (or specifically the Emmet plugin for CodeMirror), which is what FCC uses to generate these code snippets.

Here's the Cheat Sheet for Emmet. Scroll down to the CSS section and you'll see that the abbreviation for color: ; is "c" and for column-rule: ; is "colmr".

According to the cheat sheet:

CSS module uses fuzzy search to find unknown abbreviations, e.g. ov:h == ov-h == ovh == oh.

This may be why pressing tab after typing "color" results in a match for "colmr" for column-rule instead of "c" for color.

@alistermada this is really helpful, thanks!

@alistermada is correct. Emmet is different from normal tab completion. Thanks and happy coding!