# Why do " class="container task-1" show?

**URL:** <https://forum.pinegrow.com/t/why-do-class-container-task-1-show/6374>\
**Category:** General\
**Created:** [March 11, 2022, 11:51am UTC](https://forum.pinegrow.com/t/why-do-class-container-task-1-show/6374 "2022-03-11T11:51:26Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![alexseo](https://avatars.discourse-cdn.com/v4/letter/a/779978/32.png) [@alexseo](https://forum.pinegrow.com/u/alexseo)\
**Post date:** [March 11, 2022, 11:51am UTC](https://forum.pinegrow.com/t/why-do-class-container-task-1-show/6374/1 "2022-03-11T11:51:26Z")

</div>

1. 

 ![스크린샷 2022-03-11 오후 8.43.39](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/e/e343efa87a4e38f1204c8b4cb4972a0f797874f4.png)

=\> I type .task-1.container

=\> Why do " class=“container task-1” show ?

=\> I want classes to be ordered by my typing order.  
That is to say :: " class=“task-1 container”

1. I delete .task-1.container by clicking trash icon.  
But the followings are not deleted in source code and tree panel.

 ![스크린샷 2022-03-11 오후 8.43.49](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/f/f4aa5b46a6247986fdbaf807fa560f5bfd37c72c.png)  
 ![스크린샷 2022-03-11 오후 8.43.56](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/a/a1de7b9b19acbb0ffceb6756835a1c8a3a8e8163.png)

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [March 11, 2022, 1:08pm UTC](https://forum.pinegrow.com/t/why-do-class-container-task-1-show/6374/2 "2022-03-11T13:08:21Z")

</div>

Hi @alexseo,  
You stylesheet rules don’t impact the DOM tree. The name in the DOM tree comes from the order of the classes in your actual HTML, as shown in the bottom picture.  
Cheers,  
Bob

---

<div class="post-metadata">

**Author:** ![alexseo](https://avatars.discourse-cdn.com/v4/letter/a/779978/32.png) [@alexseo](https://forum.pinegrow.com/u/alexseo)\
**Post date:** [March 12, 2022, 10:46am UTC](https://forum.pinegrow.com/t/why-do-class-container-task-1-show/6374/3 "2022-03-12T10:46:17Z")

</div>

Thank you for your replay.

However, I want to type ADD CLASSES TO ~~~~~ or select classes,  
but when I type class names or select class names  
and then the classes are ordered alphabetically.

I want the class’ order to be on what I type in order.

How can I set up for that.

Thanks.

 ![스크린샷 2022-03-12 오후 7.42.31](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/1/11999dc18b2115b45e22ea57b51d4c22ee2ad533.png)

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [March 12, 2022, 10:53am UTC](https://forum.pinegrow.com/t/why-do-class-container-task-1-show/6374/4 "2022-03-12T10:53:48Z")

</div>

Hi @alexseo,  
Right now Pinegrow alphabetizes the classes. This was done to make it easier to understand class-based frameworks like Tailwind CSS and Bootstrap. It won’t impact any of your code/CSS.  
Cheers,  
Bob

---

<div class="post-metadata">

**Author:** ![alexseo](https://avatars.discourse-cdn.com/v4/letter/a/779978/32.png) [@alexseo](https://forum.pinegrow.com/u/alexseo)\
**Post date:** [March 14, 2022, 10:12am UTC](https://forum.pinegrow.com/t/why-do-class-container-task-1-show/6374/5 "2022-03-14T10:12:21Z")

</div>

Thank you very much for replying.

" Right now Pinegrow alphabetizes the classes. "  
I hope that the above thing will be changed by selection.  
That is to say:

1. alphabetically orderd selection
2. the order of a user’s type order selection

Thanks.
