Question
Morgan Stanley
IN
Last activity: 15 May 2016 8:24 EDT
Create equal height containers in dynamic layout
Hi
Do we have any OOTB way to set equal height for the layouts appearing side by side.
In the below screen shot i have used inline grid double layout. However, the height of both the containers is not same.
Any insight into setting container height would be very helpful
Thanks
Avinash
Pegasystems Inc.
US
Hi Avinash
COuld you post screen shots of your layout ?
If you are using different controls within the dynamic container, like label, images , icons, you might want to set it to a particular height via the skin
Morgan Stanley
IN
Thanks Krithi.
Below is the screenshot of our layout. We are using grid double
The 1st layout is stacked.. The second one is grid triple.
Pegasystems Inc.
US
Hi Avinash
I meant the rule form from you designer studio with wireframes on
Morgan Stanley
IN
We worked around the issue by writing some css...
Below is the rule form in designer studio: Please let me know if there is any OOTB way of setting the containers with equal height.
Accepted Solution
Morgan Stanley
IN
We have achieved the above equal height containers using custom css.
1. We started with placing both the containers in a single dynamic layout with grid double
2. Created a new formatting to the parent(grid double) layout which does not add any kind of padding but yet sets the background white
3. Created a css which sets the border right thickness to 5px and color as #EFEFEF (same as the background color of rest of webpage)
4. Apply the custom css to the first layout in the parent container (grid double).
The best thing is that it renders well in Tab and Desktop.. Which is what we wanted to achieve.