Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

To begin, open Visual Designer in a compatible browser, and find the Layouts widgets (on the left-side toolbox). Drag the "Responsive Layout" onto the design canvas.

Image RemovedImage Added

The default gives you five containers in a layout with four, equally-spaced columns and two equally-spaced rows. You can add or remove containers using the icons or by setting the "layout items" property.

...

You will see the Responsive Layout Editor, which allows you to graphically change the layout.

Image RemovedImage Added

Feel free to experiment with any part of the tool. You can always click Cancel to abort your changes. The behavior may not make sense without some background about how CSS Grid Layout works.

...

The web standard behind our Responsive Layout tool, CSS Grid Layout, takes some effort to learn. Instead of learning this new CSS technology and coding CSS by hand, you can use our visual layout editor to start designing responsive layouts.

Image RemovedImage Added

Responsive Layout Properties

...