# Auto-apply css classes when selecting them

**URL:** <https://discourse.mozilla.org/t/auto-apply-css-classes-when-selecting-them/89887>\
**Category:** Developer Tools\
**Created:** [December 5, 2021, 8:49pm UTC](https://discourse.mozilla.org/t/auto-apply-css-classes-when-selecting-them/89887 "2021-12-05T20:49:18Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![ipop99](https://avatars.discourse-cdn.com/v4/letter/i/f6c823/32.png) [@ipop99](https://discourse.mozilla.org/u/ipop99)\
**Post date:** [December 5, 2021, 8:49pm UTC](https://discourse.mozilla.org/t/auto-apply-css-classes-when-selecting-them/89887/1 "2021-12-05T20:49:18Z")

</div>

Due to work related circumstances, I need to move from Chrome to Firefox. But there’s one thing that’s driving me nuts.

How do I make Firefox apply css classes only when selecting them?

[![r/firefox - Moving from Chrome to Firefox, developer tools drive me nuts](https://us1.discourse-cdn.com/flex001/uploads/mozilla/original/3X/b/d/bd1959f93e0ce4407ff6464905be75e98d52816d.png)](https://preview.redd.it/enujpyd5yp381.png?width=473&format=png&auto=webp&s=0c96f190d0f769816f9bdb7e18a11a5721eef83d)

On Chrome if you do the same thing, it applies the css class without hitting enter.  
On Firefox I need to select it, hit enter, unckeck if it’s not ok and try again…

It’s very useful when searching for the appropriate `bg-*`, `margin/padding-*` or other tweaks like this.

I found this topic: [CSS class autocompletion](https://discourse.mozilla.org/t/css-class-autocompletion/61678) but it’s only for CSS autocomplete, not autocomplete and autoapply.

@zbraniecki thank you for the suggestion 👋

LE: this topic is a follow-up of this reddit post [Reddit - Dive into anything](https://www.reddit.com/r/firefox/comments/r9evul/moving_from_chrome_to_firefox_developer_tools/)

---

<div class="post-metadata">

**Author:** ![jdescottes](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/jdescottes/32/22185_2.png) [@jdescottes](https://discourse.mozilla.org/u/jdescottes)\
**Post date:** [December 6, 2021, 9:41am UTC](https://discourse.mozilla.org/t/auto-apply-css-classes-when-selecting-them/89887/2 "2021-12-06T09:41:36Z")

</div>

Hi!

That’s being worked on at [https://bugzilla.mozilla.org/show\_bug.cgi?id=1654731](https://bugzilla.mozilla.org/show_bug.cgi?id=1654731)

It’s a quite difficult part of the codebase, but thankfully a brave contributor who already added a preview of the class “as you type” is currently writing a patch to add this feature. Feel free to follow the progress on Bugzilla. I don’t think this will make it in time for 96, but 97 should be ok.

---

<div class="post-metadata">

**Author:** ![XXVII](https://avatars.discourse-cdn.com/v4/letter/x/c5a1d2/32.png) [@XXVII](https://discourse.mozilla.org/u/XXVII)\
**Post date:** [June 19, 2024, 11:28pm UTC](https://discourse.mozilla.org/t/auto-apply-css-classes-when-selecting-them/89887/3 "2024-06-19T23:28:09Z")

</div>

When is this coming? Its 2024 and its still missing

---

<div class="post-metadata">

**Author:** ![Nicolas\_Chevobbe](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/nicolas_chevobbe/32/28203_2.png) [@Nicolas\_Chevobbe](https://discourse.mozilla.org/u/Nicolas_Chevobbe)\
**Post date:** [June 20, 2024, 8:22am UTC](https://discourse.mozilla.org/t/auto-apply-css-classes-when-selecting-them/89887/4 "2024-06-20T08:22:55Z")

</div>

This was added in Firefox 101: the selected element in the autocomplete is added into the selected node classList.  
Isn’t it working for you? Can you describe what you’d expect from it?