Parsys displays with 0 width | Community
Skip to main content
JoseBerciano
New Participant
November 22, 2016
Solved

Parsys displays with 0 width

  • November 22, 2016
  • 3 replies
  • 2478 views

Hi everyone, I am struggling a bit with this issue, hopefully someone can give a hand.

So I created a component that displays 2 columns with a parsys on each one of them. For some reason these parsys are being displayed with 0 width:

When I inspect the generated HTML for the component I can see this:

cq5 adds a <div class="cq-placeholder-etc-etc-etc"></div> with the actual parsys placeholder, though these elements have 0 width.

What it is even more odd, if I edit the HTML with Chrome and remove that div, cq5 is rendering it again but now with the right width:

I have checked the differences between the previous generated parsys and the one after removing it effectively the only difference is the width https://www.diffchecker.com/leLvyQdR

Has any of you guys seen this before? Any advice on how to tackle this issue?

I am currently using CQ5 5.6.1, Java 1.7.0_79

KInd regards.

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 JoseBerciano

Thanks smacdonald2008 and bsloki for your help, really appreciated.

I discovered the issue was effectively specific to the css created for those pages as I tested my component in a different project and worked just fine.

I could not figure out which css property was the one breaking the placeholder layout, but after 3 exhausting days I considered this work around good enough to fix the issue:

 

.row .column .parsys, .row .column .parsys div{ width: 100%; }

Cheers.

3 replies

JoseBerciano
JoseBercianoAuthorAccepted solution
New Participant
November 24, 2016

Thanks smacdonald2008 and bsloki for your help, really appreciated.

I discovered the issue was effectively specific to the css created for those pages as I tested my component in a different project and worked just fine.

I could not figure out which css property was the one breaking the placeholder layout, but after 3 exhausting days I considered this work around good enough to fix the issue:

 

.row .column .parsys, .row .column .parsys div{ width: 100%; }

Cheers.

Lokesh_Shivalingaiah
New Participant
November 22, 2016

I think there would be some CSS conflict or the div issue in the column ctrl component. Essentially this should not be the case.

Can you try out of the box column control component and see if you still face the same issue.

smacdonald2008
New Participant
November 22, 2016

I am looking into this issue. I will post back findings.