v-row and v-col meaning is swapped about vuetify HOT 7 CLOSED

I guess I'm not sure how you are drawing that conclusion. Could you explain further? I'm not the first come up with this grid naming structure, it's pretty well used everywhere.

from vuetify.

In the documentation example the structure is the following:

v-row
    v-col
    v-col
    v-col
    v-col
    v-col
    v-col

Which should mean that there's one row with 6 columns (let's ignore the for-loops).

But in reality, I think the markup should be:

v-row
    v-col
v-row
    v-col
v-row
    v-col
v-row
    v-col
v-row
    v-col
v-row
    v-col

Basically what I'm saying is that the markup is telling me there's only one row, when there's really 6.
Unless I'm totally confusing something here of course.

from vuetify.

The columns are dynamic and part of a flex box. In order for that to work, they must be contained within the same row. Once you move them into different rows, they will always be on a new line.

from vuetify.

Right, that's what I found out when trying to add a few v-row's, which didn't make sense to me.

So if v-row doesn't really add new rows because v-col does it automagically, what's it purpose?

from vuetify.

@mfferreira I guess you're not taking into consideration that when the total width of the cols exceed the row-width they will break line. This is perfectly normal. https://jsfiddle.net/5ohybqoe/

from vuetify.

@Pwntus I totally understand that.

But actually I got it working as expected now. I'm not sure what I was doing wrong...
Closing.

from vuetify.

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs. Please direct any non-bug questions to our Discord

from vuetify.