Smartstore CMS Page Builder verwendet die CSS-Grid-Technologie, um seine Designs zu rendern. Page Builder-Benutzer müssen sich nicht mit CSS-Gittern auskennen, um schöne Designs zu erstellen. Jetzt gibt es ein neues Webdeveloper-Tool im Google Chrome Browser: Inspect CSS Grid. Sie finden es in den Entwicklertools.
Wenn auf ein HTML-Element auf einer Webseite display: grid oder display: inline-grid angewendet wurde, sehen Sie in der HTML-Quelltext im Chrome-Browser-Panel "Elements" ein graues Grid-Badge (siehe roter Kreis im Screenshot unten). Klicken Sie auf dieses Badge "grid", um die Anzeige eines Raster-Overlays auf der Seite einzuschalten.
Das Chrome-Bedienfeld "Layout" verfügt über einen neuen Abschnitt "Grid" (siehe roter Pfeil), der Ihnen eine Reihe von Optionen zur Anzeige des Grids und seiner tabellenartigen Layoutstruktur sowie eine Liste aller Grids auf einer Webseite bietet.
Wie Sie auf der Startseite von smartstore.com sehen können, wo wir Page Builder und CSS-Grids intensiv nutzen, gibt es viele Grids in dieser Liste zum Ansehen und Prüfen.