Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

difference between AEM layout container VS bootstrap media queries?

Avatar

Level 3

I am so confused so have few questions regarding responsive layout. Really appreciate if someone will help me to understand this:

1. would like to know if AEM is using bootstrap to implement responsive grid? If yes then which version of bootstrap?

2. Our project is already using bootstrap and media queries to achieve responsive layout so can I use AEM layout container also?

3 difference between bootstrap media queries and AEM layout container?

4. Which approach is better? bootstrap framework or layout containet?

1 Accepted Solution

Avatar

Correct answer by
Level 10

AEM is not use bootstrap but its custom grid framework

Responsive grid is positioned to support human/ad-hoc adjustment of page layout, bootstrap is positioned for automatic adjustment as defined in code

if you are using AEM responsive grid, i would avoid using another grid system, but rather make components themselves responsive (as needed via media queries)

Bootstrap Project on AEM

https://helpx.adobe.com/experience-manager/kt/sites/using/simple-code-use/simple-plus-bootstrap-3-co...

With bootstrap author does not get the ability to define the component view in a particular device / width.

View solution in original post

2 Replies

Avatar

Correct answer by
Level 10

AEM is not use bootstrap but its custom grid framework

Responsive grid is positioned to support human/ad-hoc adjustment of page layout, bootstrap is positioned for automatic adjustment as defined in code

if you are using AEM responsive grid, i would avoid using another grid system, but rather make components themselves responsive (as needed via media queries)

Bootstrap Project on AEM

https://helpx.adobe.com/experience-manager/kt/sites/using/simple-code-use/simple-plus-bootstrap-3-co...

With bootstrap author does not get the ability to define the component view in a particular device / width.

Avatar

Level 3

Okay so you mean to say create dynamic templates and then in layout container add components which is developed as responsive using media queries, instead of adjust them using layout mode AEM grids.