Quasar: Row breaks adding q-gutter

[CristalT]

Software version

Operating System - Linux(4.15.0-47-generic) - linux/x64
NodeJs - 8.9.0

Global packages
  NPM - 6.8.0
  yarn - 1.15.2
  @quasar/cli - 1.0.0-beta.4
  cordova - 9.0.0

Important local packages
  quasar - 1.0.0-beta.16 -- High performance, Material Design 2, full front end stack with Vue.js -- build SPA, SSR, PWA, Hybrid Mobile Apps and Electron apps, all simultaneously using the same codebase
  @quasar/app - 1.0.0-beta.15 -- Quasar Framework App CLI
  @quasar/extras - 1.1.1 -- Quasar Framework fonts, icons and animations

Browsers: Chrome Versión 72.0.3626.109 (Build oficial) (64 bits)

JsFiddle

https://jsfiddle.net/w071vpxh/14/

What did you get as the error?

Row grid breaks adding .q-gutter-{size} class

What were you expecting?

Columns must be shown next by other on an horizontal row just like first example at the JsFiddle where .q-gutter-{size} class is not present.

[rstoenescu]

If children do not use "col-" classes, then you can use "q-gutter-".
If children do use "col-" classes, then you must use "q-col-gutter-".

https://jsfiddle.net/rstoenescu/wvg6jbze/1/

q-gutter-* -> https://v1.quasar-framework.org/layout/grid/gutter#Classes-%E2%80%9Cq-gutter-%7Bsize%7D%E2%80%9D
q-col-gutter-* -> https://v1.quasar-framework.org/layout/grid/gutter#Classes-%E2%80%9Cq-col-gutter-%7Bsize%7D%E2%80%9D