Full-time web dev; JS lover since 2002; CSS fanatic. #CSSIsAwesome
I try to stay up with new web platform features. Web feature you don't understand? Tell me! I'll write an article!
He/him
Huh, that's interesting. But man, it bugs me that they went full non-standard. Non-standard tags like <grid> and <c>, non-standard attributes like columns and span without prefixing with data-... the tags especially bother me, because (unless I misunderstand) the non-standard tag names are required. I couldn't use semantic HTML with raster.css if I wanted to, could I? Or is there a way I could use <main> or <article> or <section> with like class="grid" or something? Because, at least based on the code snippets on the landing page, the CSS selectors seem to be explicitly bound to the <grid> and <c> tags:
/* Raster grid subsystem (rsms.me/raster) */grid{display:grid;--grid-tc:repeat(4,1fr);grid-template-columns:var(--grid-tc);--grid-cs:1;/* column start */--grid-ce:-1/* column end */}/* c -- cell or column */grid>c{display:block;appearance:none;-webkit-appearance:none}grid[columns="1"]{--grid-tc:repeat(1,1fr)}grid[columns="2"]{--grid-tc:repeat(2,1fr)}grid[columns="3"]{--grid-tc:repeat(3,1fr)}/* ... */
It seems to be a cool start of something, but I really wish they would switch from grid[columns=1] to .grid[data-columns=1], etc. Or at least offer that as an option, because straight up preventing me from using semantic elements eliminates like half of the value that I see in CSS Grid. It's a deal breaker for me if I lose the flat semantic structures that don't require a ton of gross non-semantic container divs just to make my CSS happy.
rsms.me/raster/
Huh, that's interesting. But man, it bugs me that they went full non-standard. Non-standard tags like
<grid>
and<c>
, non-standard attributes likecolumns
andspan
without prefixing withdata-
... the tags especially bother me, because (unless I misunderstand) the non-standard tag names are required. I couldn't use semantic HTML with raster.css if I wanted to, could I? Or is there a way I could use<main>
or<article>
or<section>
with likeclass="grid"
or something? Because, at least based on the code snippets on the landing page, the CSS selectors seem to be explicitly bound to the<grid>
and<c>
tags:It seems to be a cool start of something, but I really wish they would switch from
grid[columns=1]
to.grid[data-columns=1]
, etc. Or at least offer that as an option, because straight up preventing me from using semantic elements eliminates like half of the value that I see in CSS Grid. It's a deal breaker for me if I lose the flat semantic structures that don't require a ton of gross non-semantic container divs just to make my CSS happy.All true, I feel u brother! But still, its a cool lightweight framework.