Login
You're viewing the front-end.social public feed.
  • CSS by T. Afif :verified:css
    Aug 31, 2026, 9:14 PM

    I think we missed the opportunity to call it "grid-col" instead of "grid-column" to have ... better-written code and avoid adding extra spaces to align it with "grid-row"

    I know I am not alone in the side quest of having the values as aligned as possible 🙃

    The following CSS code: .item { grid-col: 5; grid-row: 2; /* instead of */ grid-column: 5; grid-row: 2; }
    💬 4🔄 0⭐ 8

Replies

  • 💬 1🔄 0⭐ 0
  • CSS by T. Afif :verified:css
    Aug 31, 2026, 10:03 PM

    @u0421793 it's not "col", it's "grid-col" and there is a context so it's impossible to be an abbrev of any word you listed because none of them make sense in that context.

    btw, we use "flex" which is the abbrev of "flexible"

    💬 1🔄 0⭐ 1
  • 💬 1🔄 0⭐ 0
  • Amelia Bellamy-RoydsAmeliaBR
    Sep 1, 2026, 2:23 AM

    @css @u0421793 And there is precedence in HTML: the <col> element, colspan attribute and col value for scope attribute.

    However, CSS is fairly consistent about spelling out column, although there's a col-resize keyword for the cursor property.

    💬 1🔄 0⭐ 1
  • Ian Tindaleu0421793@toot.pikopublish.ing
    Sep 1, 2026, 5:07 AM

    @AmeliaBR@front-end.social @css@front-end.social indeed, and this shouldn’t have been the case either - col isn’t a thing. Really, abbreviating should be banished, it’s unfriendly and unhelpful. I don’t mind abbreviating for my own purposes, ie if I jot something down on a piece of paper as a note, and I’m the one who will read it later, that’s where an abbreviation is appropriate. But I really take great exception to having abbreviations escape into the wider world, it is an ill, and only serves to keep in-groups barriered in, and outside people outside. It is bad.

    💬 0🔄 0⭐ 1
  • spartanatreyuspartanatreyu@mastodon.social
    Sep 1, 2026, 3:14 AM

    @css

    Example:

    ```
    grid-░░░░░░: 3;
    grid-░░░: 3;
    ```

    Counterpoint 1:

    Keeping the widths different makes it easier to pick the right one while bleary-eyed.

    Counterpoint 2:

    People get column and row confused, especially while trying to learn/relearn. Column is set to 3. Does that mean there are 3 columns or that each column has 3 things in it?

    Easy way to remember: "column" is wider than "row", so column controls the grid's width. (or x-axis density when grid can't grow wider)

    💬 0🔄 0⭐ 0
  • toptop@norden.social
    Sep 1, 2026, 9:38 AM

    @css
    “grid-column” and “grid-row” are already shorthand forms of the CSS properties ending in “-start” and “-end.” Should there then also be a “grid-col-sta”? 🥴

    I think it would make more sense to combine the two properties. For example:
    “grid-column-row: 1, 2;”
    “grid-column-row: 1 / 3, 2 / -1;”

    💬 1🔄 0⭐ 0
  • 💬 1🔄 0⭐ 0
  • toptop@norden.social
    Sep 1, 2026, 10:22 AM

    @css
    Oh, you're actually right. In my defense, though, I have to admit that I rarely use “grid.”

    💬 0🔄 0⭐ 0
  • mdavismdavis@mastodon.social
    Sep 2, 2026, 7:39 PM

    @css You’re probably right. I think colgroup came first and established “col” then, yes?

    💬 0🔄 0⭐ 0