Function : This tree shows all the css rules declared in the css file currently edited.

Rules are classed by selector and each different selector got a specific folder. If several rules got the same selector without taking care of the pseudo-elements or pseudo-classes, then all theses rules are regrouped in the same folder. When you select a css rule by clicking on it, the displayed attributes panels is updated with the values contained inside the css rule. You have also the possibility to delete the selected rule by clicking on the delete button or by hitting the del key.