Smartstore CMS Page Builder uses the CSS Grid Technology to render its designs. Page Builder Users do not have to know about CSS grids to create nice designs. Now there is a new webdeveloper tool in Google Chrome Browser: Inspect CSS Grid. You find it in the Developer Tools.
When an HTML element on a web page has display: grid or display: inline-grid applied to it, you can see a grey grid badge (see red circle in screenshot below) next to it in the HTML Source at Chrome Browser "Elements" panel. Click that badge "grid" to toggle the display of a grid overlay on the page.
The new Chrome "Layout" pane has a grid section (see red arrow) offering you a number of options for viewing the grids and its table-like layout structure, and a list of all grids on a webpage.
smartstore-chrome-grid-screenshot.jpg 112.26K 0 Anzahl Downloads
As you can see on smartstore.com homepage, where we use Page Builder and CSS grids heavily, there are many grids in that list to view and inspect.