How to create automatic section numbering only when there are multiple sections using CSS

In creating this using CSS will take some procedures using :the only-not type or :not selector in our CSS.Below is a breakdown of the procedure:

For instance if we have <h3> and <h3> tags are all under the same parent you can go with :not and :only-of-type selectors:

h3:not(:only-of-type)::before{
    counter-increment: sub-section;
    content: counter(section) "." counter(sub-section) " ";
}

The :only-of-type will only match elements which have no other sibling of the same tag name. So it’ll match only <h3> which are the only <h3> of their parent.

The :not negates it, making the selector to match only <h3> tags when its parent have more than one <h3> child.

It reads like “Match all H3 which are not the only H3 child of its parent”.