Reviewing the information about the AEM6.1 Responsive Grid, http://adobe-marketing-cloud.github.io/aem-responsivegrid/ and http://www.slideshare.net/GabrielWalt/aem-responsive
Slide 11 indicates that when nesting layout containers, the number of columns should be fixed and not reset. But in my attempts at this, the nested layout containers show 12 columns even though the container is nested and set to 8 columns with respect to the parent. The customization applied wraps the responsivegrid in a section tag to apply a background color to the section.
<section class="${properties.themeColor ? properties.themeColor : ''}-bg"> <section data-sly-test="${properties.bgOptions != 'none'}" class="${properties.themeColor ? 'section-bg': ''} ${properties.bgOptions}"> <section class="${properties.wrapper? 'container' : ''} ${properties.innerOptions}"> <div data-sly-resource="${'responsivegrid' @ resourceType='wcm/foundation/components/responsivegrid'}"> </div> </section> </section> <section data-sly-test="${properties.bgOptions == 'none'}" class="no-outer-bg ${properties.bgOptions}"> <section class="${properties.wrapper? 'container' : ''} ${properties.innerOptions}"> <div data-sly-resource="${'responsivegrid' @ resourceType='wcm/foundation/components/responsivegrid'}"> </div> </section> </section> </section>
Views
Replies
Total Likes
Did you build the code and look at it running:
Views
Replies
Total Likes
Thanks! That will be a good reference. The difference in this case is that I was trying to add section tag around the responsivegrid component to style the background color on the margins outsides of the grid container. It was really only needed on the outermost one. So the problem was basically fixed for the nested layout container components by adding the non-customized Layout Container instead on mine (which was adding section tags wrapping the responsivegrid component)
Views
Replies
Total Likes
I dont see you defining the nested grid in the above piece of Code. Where have you grouped 8 columns here ??
refer slide #29 here http://www.slideshare.net/GabrielWalt/aem-responsive to achieve the nested grid.
Views
Replies
Total Likes
The responsivegrid component (Layout Container) can be dropped into the responsivegird like a regular component. This is what I am referring to as a being 'nested.'
Views
Replies
Total Likes
Are you referring to the column control components ?
Views
Replies
Total Likes
Did you solve this?
Views
Replies
Total Likes
Views
Likes
Replies
Views
Likes
Replies
Views
Likes
Replies