WPBakery Page Builder plugin allows you to control columns across multiple devices. You can do that from the Responsive Options tab which can be found in settings for any of the columns.
These settings allow you to set the column width and offset for the default column size, and for other devices/screen sizes as well. In addition, you can also Hide columns on specific device types if you wish to prevent a specific block from being displayed on mobile devices which have a certain screen size.
Here’s a brief guide through the options available here.
Width
Use this option to set the default column width in all browser window sizes. This option will be the default option for the next set of options in the Responsiveness section. The option works proportionally and you can set fractures of the whole column width which contains 12 portions, or you can use predefined percentage values for column width.
Responsiveness
Here you can adjust columns for different screen sizes. You can control width, offset and visibility settings.
Device option allows you to set different column behaviors on different screen sizes:
- Large (Desktop) – for screen sizes larger than 1200px.
- Medium (Tablet Landscape) – for screen sizes from 992px to 1200px.
- Small (Tablet Portrait) – for screen sizes from 768px to 992px.
- Extra small (Mobile) – for screen sizes smaller than 768px.
- Offset – allows you to set the offset for the column. You may use columns to specify the offset value. It represents the amount of space to the edge of the page.
- Width – allows you to set the different width for the column on different screen sizes to restructure the content properly.
- Hide on device? – tick this to hide the elements on certain screen sizes.
The Offset and Width settings are very much like the ones available in the Width option which we went through earlier.