Nesting [su-column] inside [row] to get them to align neatly

Question

i built a page to display content using columns stacked on top of each other (with shortcodes ultimate)

[su_column] content [/su_column]
[su_column] content [/su_column]
[su_column] content [/su_column]
<p> content </p>

[su_column] content [/su_column]
[su_column] content [/su_column]
[su_column] content [/su_column]
<p> content </p>

[su_column] content [/su_column]
[su_column] content [/su_column]
[su_column] content [/su_column]
<p> content </p>

it would constantly misalign, easily solved by wrapping the blocks [su_row] [su_columns] ...... [/su_row]

full code is in comment below

images can be set to 250px width and it'll come out looking pretty nice like this: http://focallocal.org/activities/

sure this is all pretty simple, but the downvotes i received for asking for help on this topic got me blocked from asking new questions so i thought i'd post the solution in case any other newbies like me have the same issue.

Answer 1

thanks for looking. i just solved it by adding a row around each column

[su_row]
[su_column] content [/su_column]
[su_column] content [/su_column]
[su_column] content [/su_column]
[/su_row]

<p> content </p> 

[su_row]
[su_column] content [/su_column]
[su_column] content [/su_column]
[su_column] content [/su_column]
[/su_row]

<p> content </p>

[su_row]
[su_column] content [/su_column]
[su_column] content [/su_column]
[su_column] content [/su_column]
[/su_row]

<p> content </p>