I am developing an online course and have created my pages with a flexible layout set to ‘shrink to fit’ and zoom contents so it will resize according to the browser.
However, whilst my client loves the responsiveness, they also want a way to zoom in on the text within the browser to meet their accessibility requirements. With my current settings, nothing happens when zoom is used, and altering the settings breaks the responsiveness. Is there a way to allow both?
Zoom contents is a setting that uses the “scale” CSS property to visually zoom the element. When this setting is checked on a group, no children elements are laid out according to their flexible layout settings because they don’t appear to change since the parent only changes visually.
I believe what you’ll need to do is not use the “zoom contents” setting and instead set the flexible layout options for each of the children to change how you want. (It may be tricky to get right with page zoom happening)