Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

Adobe Summit 2023 [19th to 23rd March, Las Vegas and Virtual] | Complete AEM Session & Lab list
SOLVED

Layout issue

Avatar

Level 6

Hi,

I have set breakpoints at templates for mobile and tablet like this

@max_col: 12;

/* default breakpoint */
.aem-Grid {
.generate-grid(default, @max_col);
}

/* phone breakpoint */
@media (max-width: 768px) {
.aem-Grid {
.generate-grid(phone, @max_col);
}
}

/* tablet breakpoint */
@media (min-width: 769px) and (max-width: 1200px) {
.aem-Grid {
.generate-grid(tablet, @max_col);
}
}

When I try to resize the component the controls are unstable (jumping too much) and not very usable for editors.layout issue.gif

Can anyone help me to fix this.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

@Vani1012 Looks like a product issue, you may need to raise an Adobe support ticket for this.

https://helpx.adobe.com/contact/support.html

 

View solution in original post

2 Replies

Avatar

Correct answer by
Community Advisor

@Vani1012 Looks like a product issue, you may need to raise an Adobe support ticket for this.

https://helpx.adobe.com/contact/support.html

 

Avatar

Level 2

Hello @Vani1012 

 

Please try to first use the

  • grid.less that would be created from latest maven archetype.
  • Or try we.retail site first (with no custom code) on AEM instance.

 

That would help you understand, if its an AEM issue, or some modification is grid.less/project-specific CSS thats causing it.