Column control component not working in Geometrix media site But working in Geometrix Demo site | Community
Skip to main content
Raghava_Joijode
Level 2
January 6, 2017
Solved

Column control component not working in Geometrix media site But working in Geometrix Demo site

  • January 6, 2017
  • 5 replies
  • 2180 views

HI All, 

I added colctrl(Column control - Sightly) component in geometrixx-media site but it is not working , I am unable to see parsys between 'start of column' and 'end of column'

Please find the attached screenshots 

It is working finne as expected in demo site.

I have even included the below css in media site:


/* column control layouts */
div.cq-colctrl-cols {width: 100%; float: left; }

div.cq-colctrl-default { width: 100%;}

/* layout 0 : 50% 50% ( grid6 + grid6 ) */
div.cq-colctrl-lt0 { }
div.cq-colctrl-lt0-c0 { width: 340px; margin-right:10px}
div.cq-colctrl-lt0-c1 { width: 340px; margin-left: 10px}

/* layout 1 : 33% 33% 33%( grid4 + grid4 + grid4 ) */
div.cq-colctrl-lt1 { }
div.cq-colctrl-lt1-c0 { width: 220px; margin-right: 10px;}
div.cq-colctrl-lt1-c1 { width: 220px; margin-left: 10px; margin-right: 10px;}
div.cq-colctrl-lt1-c2 { width: 220px; margin-left: 10px; }

/* layout 2: 16% 16% 16% 33% ( grid2.6 + grid2.6 + grid2.6 + grid4 ) */
div.cq-colctrl-lt2 { }
div.cq-colctrl-lt2-c0 { width: 140px; margin-right: 10px;}
div.cq-colctrl-lt2-c1 { width: 140px; margin-left: 10px; margin-right: 10px}
div.cq-colctrl-lt2-c2 { width: 140px; margin-left: 10px; margin-right: 10px}
div.cq-colctrl-lt2-c3 { width: 220px; margin-left: 10px }

/* layout 3: 4 x 25% ( grid3 + grid3 + grid3 + grid3 ) */
div.cq-colctrl-lt3 { }
div.cq-colctrl-lt3-c0 { width: 160px; margin-right: 10px;}
div.cq-colctrl-lt3-c1 { width: 160px; margin-left: 10px; margin-right: 10px;}
div.cq-colctrl-lt3-c2 { width: 160px; margin-left: 10px; margin-right: 10px;}
div.cq-colctrl-lt3-c3 { width: 160px; margin-left: 10px; }

/* layout 4: 5 x 20% ( grid2.5 + grid2.5 + grid2.5 + grid2.5 + grid2.5 ) */
div.cq-colctrl-lt4 { }
div.cq-colctrl-lt4-c0 { width: 124px; margin-right: 10px;}
div.cq-colctrl-lt4-c1 { width: 124px; margin-left: 10px; margin-right: 10px;}
div.cq-colctrl-lt4-c2 { width: 124px; margin-left: 10px; margin-right: 10px;}
div.cq-colctrl-lt4-c3 { width: 124px; margin-left: 10px; margin-right: 10px;}
div.cq-colctrl-lt4-c4 { width: 124px; margin-left: 10px; }

/* widepage layouts */

/* layout 5 : 50% 50% ( grid8 + grid8 ) */
div.cq-colctrl-lt5 { }
div.cq-colctrl-lt5-c0 { width: 460px; margin-right:10px}
div.cq-colctrl-lt5-c1 { width: 460px; margin-left: 10px}

/* layout 6 : 25% 25% ( grid4 + grid4 + grid4 + grid4) */
div.cq-colctrl-lt6 { }
div.cq-colctrl-lt6-c0 { width: 220px; margin-right:10px}
div.cq-colctrl-lt6-c1 { width: 220px; margin-left: 10px; margin-right:10px}
div.cq-colctrl-lt6-c2 { width: 220px; margin-left: 10px; margin-right:10px}
div.cq-colctrl-lt6-c3 { width: 220px; margin-left: 10px}

and below lines in design mode for dialog dropdown:

2;cq-colctrl-lt0    2 Columns (50%, 50%) 3;cq-colctrl-lt1    3 Columns (33%, 33%, 33%) 4;cq-colctrl-lt2    4 Columns (16%, 16%, 16%, 33%) 4;cq-colctrl-lt3    4 Columns (25%, 25%, 25%, 25%) 5;cq-colctrl-lt4    5 Columns (20%, 20%, 20%, 20%, 20%)
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 Lokesh_Shivalingaiah

If you are using responsive grid, then you dont need column control. You can very well control the width of the responsive grid.

Both of them cannot co-exists. If you want column control, then use that with responsive grid.

5 replies

Raghava_Joijode
Level 2
January 6, 2017
Added Screenshots
Lokesh_Shivalingaiah
Level 10
January 9, 2017

Hi Raghava,

It should work if you add the column control in parsys. Let me know what is the error you are seeing.

 

Thanks,

Lokesh

Raghava_Joijode
Level 2
January 9, 2017

Yes it worked when added in parsys, Is there any way to make it work when added in responsivegrid??

Lokesh_Shivalingaiah
Lokesh_ShivalingaiahAccepted solution
Level 10
January 9, 2017

If you are using responsive grid, then you dont need column control. You can very well control the width of the responsive grid.

Both of them cannot co-exists. If you want column control, then use that with responsive grid.

kautuk_sahni
Community Manager
Community Manager
January 10, 2017

As mentioned by Lokesh, If you are using responsive grid, then we don't need column control.

As we can modify the width of the responsive grid. Both of them cannot co-exists. If you want column control, then use is with parsys.

~kautuk

Kautuk Sahni