style system doesn't load for first container

[#1]

I have strange issue with container component (core component-> ehi-> ctf heirarchial inheritence) some  customization in ehi but no customization in ctf. when I drop container on the page. First container is not getting style system options, second and successive containers get style options

I looked at crx if node has container as name, no styles are shown but if I add suffix like container-1 I do see styles do show up

Looking at debugger tools in chrome I see  this call returning 403 forbidden error

http://localhost:4502/mnt/overlay/wcm/core/content/editor/_jcr_content/content/items/content/content/items/styleselector.form.html/content/crawfordtaylor/en/magento-store/container-test/_jcr_content/root/container/*/

[#2 · Accepted solution]

@shajiahmed how are you including the container component? Is the wrapper div getting generated for that, style system depend on the wrapper div.  Please refer to the below community post for reference 

https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/configuring-style-system-f...

[#3]

The issue is with the template policy. 

The policy is wrongly set for first container check policy

E.g. In below template policy example, the last container policy should not be set.

<root
            cq:policy="myapp/components/container/policy_1574694950110"
            jcr:primaryType="nt:unstructured"
            sling:resourceType="wcm/core/components/policies/mapping">
            <container
                cq:policy="myapp/components/container/policy_649128221558427"
                jcr:primaryType="nt:unstructured"
                sling:resourceType="wcm/core/components/policies/mapping">
                  <container
                      cq:policy="myapp/components/container/policy_649128221558426"
                      jcr:primaryType="nt:unstructured"
                      sling:resourceType="wcm/core/components/policies/mapping"/>
                  <myapp jcr:primaryType="nt:unstructured">
                        <components jcr:primaryType="nt:unstructured">
                           <embed   ....  
             </container>
</root>

[#4]

Well this is not a coding issue to change anything as components work fine everywhere except first one. It could be some template configuration, policy conflict or permissions

[Shashi_Mulugu]

sorry that is not an acceptable solution. I clicked by mistake. 

I do see divs are getting generated. I compared html. I see first one has <span> tag missing inside div thats why style options are not there. But why it is missing I don't have clue. I don't see any js or java exceptions in log

[Shashi_Mulugu]

No worries. That span is nothing but placeholder text. Please follow this article to generate span tags.https://blogs.perficient.com/2017/08/06/aem-component-placeholders-the-wcm-core-component-way/