A flexible Mega Panels layout works best when images are properly sized. An example use-case would be having three panels in a row, each with an image that fills the width of each panel.
In order for the image to fill the space allowed in the panel, create the images with the correct width to correspond with the size of the panel.
Width of Panel | Minimum Width |
---|---|
One Half | 540px |
One Third | 360px |
One Quarter | 220px |
For example, if your panels are each on third the width of the row, images should be at least 360px wide.
Full width images on narrower screens
If you would like the image to fill the full-width of the panel even when the panels begin to move into a single column on narrower screens, create the images at a width of 730px. The images will then shrink and grow with the panel.
Note: Be sure that your images have been resized down to no more than 730px wide for Mega Panels column panels. Very large image could impact page load time, which can be a usability issue for users with slower internet connections.