Sitecore SXA with Bootstrap 4

Question

Which bootstrap versions are compatible with sitecore SXA 1.5? Current Sitecore SXA comes with bootstrap 3.3.7. Has anyone tried using bootstrap 4? What are the pros and cons?

Answer 1

To make it compatible with most of the devices, Sitecore SXA is using bootstrap 3. but any framework can be adapted. you can add the new bootstrap 4 grid and follow the existing bootstrap structure and and modify the classes based on bootstrap 4. see image below:

Pros:

• Introduced flexbox for better designing layouts
• Because of more demand using sass instead of less
• Mixins classes like rounded-corners introduced, to fast up the pace of development
• Fonts using rem for better view on different devices

Cons:

• Bootstrap 3 has support for IE9 and iOS6. but flexbox are not supported on these browsers
• Difficult for quick adaption for those who are using bootstrap 3
• Media query breakpoints are changed because of the newly introduced device resolutions, which bootstrap 4 has catered.
• Online customiser in not available