My team is working on a responsive website and we allow the user to configure some of the properties of the page, including the spaces between the grid “cells”. We had a conversation about the correct terminology to identify the “space between cells”. Obviously we could use something like “margin”, but that’s a bit too broad as that would include the space between the page and the outermost cells. We want to identify the space between cells only. Our users are not necessarily tech-savvy (meaning CSS, etc), but may have some background in graphic design (or at least be familiar with common terminology).
“Gutter” seems like the most correct term, but most of the definitions for “gutter” that I can find specifically refer to the space between columns.
Is there a specific term for the space between rows? Or is it appropriate to simply refer to them as “horizontal gutters”?
Here’s an illustration of what I’m trying to identify.
(Image borrowed from https://www.init.de/en/news/responsive-design)
Issues with My Current Terminology
“Horizontal(/Vertical) Gutter” is a bit confusing, in my opinion, as it’s unclear whether the gutter is between horizontal(/vertical) elements or if it provides horizontal(/vertical) space between vertical(/horizontal) elements. There’s some disagreement on my team about which definition is accurate, so I think that’s evidence enough that the phrase is actually confusing.
At least in relation to the web, “padding” and “margin” aren’t appropriate for what I’m describing. Padding refers to the space between the border and the content, while margin refers to the space around an element. Two adjacent elements with a margin of 10px each would have a 20px gutter between them. (Yes, I’m aware that CSS margins often collapse, but not always.)
I’ve seen the term “gutter” used often in responsive grid frameworks, so I know it’s an acceptable term in web development. I’m just wondering if there is a more appropriate term for a “horizontal gutter”.
I would use “row spacing”.
As JDB mentioned, I too would rather use web-related terms as opposed to trying to import typesetting terms from the (fascinating) printed media world.
I would use the terms “column spacing” and “row spacing” because most grid layouts use the terms “column” and “grid”. I would avoid using the terms “margin” and “padding” to avoid clashes with CSS keywords.