Responsive design grid

Create and edit your own grid from this template

  1. The design grid is accessible only through the Navigator panel (so you can work on your project without those divs in your way).
  2. To copy the design grid into your project, select the 'design-grid-wrap' element, copy it (Ctrl/CMD+C), then paste it in your project.
  3. To change column width and margins edit the 'design-grid-column' element.
  4. To add or remove columns for desktop & tablet views only, copy+paste the 'design-grid-column' first element as much needed.
  5. To add or remove columns for all screen sizes copy+paste the 'design-grid-column' last element.
  6. You don't need to copy this card or the 'explainer' div.
  7. Actually, if you got all the way down to here, you can go ahead and delete the 'explainer' div...
  8. ...aaaand while you're at it, why not give me some Webflow lovin'?
Clone Project page