Parsys displays with 0 Width when added in custom container(Eg: Column Container) | Community
Skip to main content
A
Anusha
May 13, 2020
Solved

Parsys displays with 0 Width when added in custom container(Eg: Column Container)

  • May 13, 2020
  • 2 replies
  • 4301 views

I'm developing a component which will divide the div into 2 parts have a parsys in it (Eg: Column Control).I'm not specifying any width on parent div.

<div>

<p> Some Text </p>

<div data-sly-resource="${@path='root', resourceType='foundation/components/parsys'}"></div>

</div>

When I drag and drop this component on page, parsys rendering with width 0px.

style="top: 35px; left: 0px; width: 0px; height: 40.25px;"

If any component in added in the parsys its automatically taking the width of component. 

Please suggest me , how can I identify whether some compnent is authored in write a condition to apply custom css.

 

Thanks,

Anusha A.

 

 

 

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Ankur_Khare

Hi Anusha,

 

Please refer this link for your requirement-

https://helpx.adobe.com/experience-manager/using/bootstrap_grid.html

Well explained how to create a column component.

2 replies

Ankur_Khare
Community Advisor
Ankur_KhareCommunity AdvisorAccepted solution
Community Advisor
May 14, 2020

Hi Anusha,

 

Please refer this link for your requirement-

https://helpx.adobe.com/experience-manager/using/bootstrap_grid.html

Well explained how to create a column component.

    K
    Karthikachery
    October 8, 2024

    This link is not working, anyone know how to fix this issue?

    Theo_Pendle
    Theo_Pendle
    Level 8
    May 14, 2020

    Hello @anusha ,

    I think I might have the answer to your question but I'm not sure because I'm a bit confused by the wording. Could you please:

    1. Show us the end result you want
    2. Show us a screenshot of what you have
    3. Tell us if you are using any CSS grid system (custom or Bootstrap, etc.)

     

      A
      AnushaAuthor
      May 15, 2020

      Hi Theop,

      Thankyou  for your response.

       

      1. In container component I need to add some other components like cards etc . whenever we drag and drop the components in parsys they should align side by side and another parsys should be visible as shown below. 

      2. Now I'm not able to see the parsys with full text " Drag Components here" because its  width is 0px.

      3. I'm using default bootstrap class="row" in container component and I'm using class="col-sm-3" in  card component .

      In Container component I'm writing only below 2 lines

      <div class="row">
      <sly data-sly-resource="${@path='main-child', resourceType='foundation/components/parsys'}"></sly>
      </div>

       

      Please help to resolve this issue.

       

      Regards,

      Anusha A.

      sreenu539
      sreenu539
      Level 7
      August 25, 2022

      were you able to solve this issue? I am in need of column control component with three columns having a parsys and facing same 0 width issue.

      Terms & ConditionsAccessibility statement

      Loading footer...