# [Sage 10 &9?] Tailwind in editor.scss. Editor blocks not effected?

**URL:** https://discourse.roots.io/t/sage-10-9-tailwind-in-editor-scss-editor-blocks-not-effected/20501
**Category:** sage
**Tags:** sage10, sage9
**Created:** 2021-04-02T07:20:56Z
**Posts:** 1

## Post 1 by @Tim — 2021-04-02T07:20:56Z

Hey all,

I’ve got a question about the `editor.scss` in the gutenberg editor. I would like to use some of the tailwind features in the editor from `tailwindcss/utilities`. For this I’ve added the following to the scss:

```
.block-editor-block-list__layout {
  @import '~tailwindcss/base';
  @import '~tailwindcss/components';
  @import '~tailwindcss/utilities';
}
```

But this doesn’t seem to work. When I place it outside the `.block-editor-block-list__layout` selector it does work. But then the entire backend is affected. And I just want the editor.

**Question:**  
How would I add Tailwind to the block editor?

I would expect a result like:

```
.block-editor-block-list__layout{
    .w-6/12{
        ...
    }
}
```

**Thoughts**

- Is this because with this code I place html,body selectors inside a child selector? (`.block-editor-block-list__layout body{}`
- I saw the `setup.php` uses `wp_enqueue_style()` and not `add_editor_style()` And I using the `editor.scss` for the right goal?

**Side note**  
importing `~tailwindcss/utilities` boosts the rendered css with an extra 3.7mb. This is rather big, not? (both in app.scss as editor.scss)

---

## Post 2 by @system — 2021-05-14T07:20:59Z

This topic was automatically closed after 42 days. New replies are no longer allowed.