Get a free trial // Grow your CSS skills // Land your dream job

Codepen Emmet SCSS

  • # June 13, 2013 at 7:02 am

    Hi, guys.

    Is in Codepen option to use Emmet in CSS(SCSS)?

    When I use it in simple CSS works good **d + TAB** becomes **display: ;** but in SCSS becomes

    d  /d

    , can I somehow to fix it?

    Plus annoying red messages – invalid css


    # June 13, 2013 at 8:53 am

    Did you mean <d></d>?

    Same here. :( I swear it used to work though, I don’t recall such problems before.

    # June 13, 2013 at 9:46 am

    I don’t know but to the best of my googling…Emmett does not support SAAS/SCSS

    # June 13, 2013 at 9:48 am

    @jimmyniceguy yepp, the same here (((

    @Paulie_D I use Emmet in Webstorm for .scss

    # June 13, 2013 at 9:51 am

    **Webstorm** have done something but I can’t find anything in the Emmett documentation.

    # June 13, 2013 at 10:49 am


    All CSS is valid SCSS. Expanding “d” to “display” worked for CSS, therefore it will/should work in SCSS.
    I work in Sublime Text 2 with Emmet, using SCSS and I am having no problem with “d”, “pos”, “m0”, “p0”, “!”, etc at all.

    # June 13, 2013 at 11:00 am

    What I am saying is the it Emmet doesn’t work out of the box in “SCSS format”.

    Logically it should but 3rd party apps obviously have there own workarounds / implementation to reproduce that functionality…or have I missed something?

    Whether Codepen can do the same would be nice but that’s an update / upgrade we can hope for.

    # June 15, 2013 at 4:57 pm

    I just fixed this – we’ll push it out maybe tonight or tomorrow. Thanks for the heads up!

    I’d love support to go through if possible. I’ll try and watch everywhere, it’s just when it goes through there there is a 100% chance the team will see it =)

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed