iiinova — where your digital self keeps evolving

Roma Komarov @kizu.front-end.social.ap.brid.gy · 20/10/2026

@cheeaun hmm, I think this is mastodon :blobcatthink: (I know that for non-main instances that will feel fine, but given the main instance is representative, I wonder if the setup could come with some config that could allow tweaking this place specifically to not look so unpolished)

A crop of a screenshot from a UI, reading as “Mastodon powered by Mastodon”.

A crop from a screenshot of a footer UI, showing a pair of header plus link links, first reads as “Mastodon: About, Terms, Privacy, Statis, Directory”, second reads as ”Mastodon v5.0.0 [the rest of the version]: Source Code, Apps, Help, Feedback”.

100 1

Roma Komarov @kizu.front-end.social.ap.brid.gy · 10/10/2026

Checked today, and the built-in hidden-until-found of `<details>` also works well with anchor links inside.

1273 27

Roma Komarov @kizu.front-end.social.ap.brid.gy · 14/08/2026

Some time ago, I started using vertical tabs in Firefox Nightly. It led to me not closing them as often as before. With the recent Firefox UI update, it seemed that something broke, and my UI started to feel very sluggish. Like, when writing something in […] [Original post on front-end.social]

A crop of a screenshot showing a dialog “Close 851 tabs?” with “Cancel” and “Close tabs” buttons.

000 0

Roma Komarov @kizu.front-end.social.ap.brid.gy · 17/05/2026

Me, working on an article and reading the specs in an attempt to understand something so I could make some interactive diagrams for my article: you and me, we have the same issue, friend.

A screenshot from the CSS specs showing a red message bar with the text “Issue 3. Insert diagrams.”

000 0

Roma Komarov @kizu.front-end.social.ap.brid.gy · 27/01/2026

I wrote a new article: “Solving Shrinkwrap: New Experimental Technique” kizu.dev/shrinkwrap-solution In this article, I present my new technique for solving a #CSS problem that was deemed impossible — true shrinkwrapping of an element with […] [Original post on front-end.social]

A screenshot of one of the article’s examples. On a white background, there are several boxes visible in a three-dimensional view. The one in the back has rounded corners, green background and a pink outline, and is shorter. The one in the middle is longer, going the full width of the screenshot, and has a pink background. The one in the front has the following text: “I am a Longer Header; I Will Wrap & Look Bad! Oh no! What Can We Do?”, wrapped after the ampersand and balanced.

2116 11

Roma Komarov @kizu.front-end.social.ap.brid.gy · 11/01/2026

RE: retro.pizza/@outofprintarchive/1158… Inspired by one of the callout styles from one of these scans: when thinking about how I would implement this in CSS, something like that would make sense.

A screenshot of a green callout with text “It is good where it counts - in the gameplay!”, where it spans two columns, with both text fragments having rounded corners and green background, and first line aligned to the left, and second line aligned to the right.

100 1

Roma Komarov @kizu.front-end.social.ap.brid.gy · 26/11/2025

New blog post: “Border: 2px double”. blog.kizu.dev/border-2px-double I wanted to write a different post today, but did not have time to finish it, oops. So let me tell you one pretty useless but fun #CSS fact.

A screenshot of three figures showing a rendering of a square for Chrome, Firefox, and Safari. Chrome renders it as two solid lines with transparent space between them. Firefox is similar, but it fills the space between lines with gray color. Safari renders it as one solid thick line, but with grey artifacts in corners.

000 0

Roma Komarov @kizu.front-end.social.ap.brid.gy · 23/11/2025

New blog post: “Photo Walk, April”. blog.kizu.dev/walk-april-2025 I am back with reposting some of my old photos from my Pixelfed, but now in my blog.

A close-up photo of a bundle of pink flowers on a branch (likely, cherry blossom). Some of their features and curves are in focus, but the background is highly blurred.

010 1

Roma Komarov @kizu.front-end.social.ap.brid.gy · 10/11/2025

New blog post: “Uneven Inline Paddings” blog.kizu.dev/uneven-inline-paddings Today, I want to share one tiny design tweak you can do to your content styles. I have used it in my blog’s design for a while, and recently decided to improve it a bit […] [Original post on front-end.social]

000 0

Roma Komarov @kizu.front-end.social.ap.brid.gy · 28/05/2025

You'd think this is a joke, but

$A screenshot of GitHub's UI showing a code search input with "<div class=\"inline\"" (content of search in double quotes, with double quotes around the inline class escaped with backslashes), and a part of its filters showing “76.8k” results in the Code tab.$

A screenshot of GitHub's UI showing a code search input with "<div class='inline'" (content of search in double quotes, with single quotes around the inline class) and a part of its filters showing “112k” results in the Code tab.

001 1

Roma Komarov @kizu.front-end.social.ap.brid.gy · 24/03/2025

New article: “Passing Data into SVG: Linked Parameters Workaround” kizu.dev/svg-linked-parameters-work… Twelve years ago, I started a draft for an article I never published: there were a few cross-browser issues and the idea was raw and […] [Original post on front-end.social]

A photo of a screen with a code block from the article. The photo is angled, with parts of the code going out of focus. Some visible parts include an `atan()` function, some CSS variables, `round()`, calc(), and `rgb()` with calculated values.

336 6

Roma Komarov @kizu.front-end.social.ap.brid.gy · 08/02/2025

Firefox Nightly, 137.0a1 (2025-02-08) → about:config → set `layout.css.style-queries.enabled` to `true` → many demos of #CSS container style queries start working! :blobcatlove: For example, all the demos from my […] [Original post on front-end.social]

A screenshot showing a `layout.css.style-queries.enabled` field with the value `true`.

Above it, a search field with “css.sty” in it.

010 1

Roma Komarov @kizu.front-end.social.ap.brid.gy · 05/02/2025

I'm sorry, how much memory my Firefox with 5 tabs open is using?

A screenshot of a Mac OS “Force Quit Applications” alert with a “Your system has run out of application memory.” title and “To avoid problems with your computer, quit any applications you are not using.” paragraph.

It is showing a “Firefox Nightly” line with a “77,37 GB” near it.

200 2

Roma Komarov @kizu.front-end.social.ap.brid.gy · 03/02/2025

Grass was greener etc., but both can be true: we were more naive, and the grass was green. It is interesting to go back in memory and analyze things, dissecting the nature of your memories and trying to fish for the good that there was. Pictured: me, ~20.5 […] [Original post on front-end.social]

A photo of a young man with long hair, sitting on a green grass with green trees in the background. He wears a green turtleneck, suede sneakers, and a green-orange hairband out of beads. He sits without glasses, looking at the sky with a slight smile.

000 0

Roma Komarov @kizu.front-end.social.ap.brid.gy · 29/01/2025

border-shape: bloop (featuring `--radius-blob`s from @argyleink's open props) codepen.io/kizu/pen/mybvzxJ Did not remember how border-radius interacts with overflow, and there is a significant difference between Chrome+Safari vs Firefox.

010 1

Roma Komarov @kizu.front-end.social.ap.brid.gy · 27/01/2025

I wrote a new article, and published a new package: “Pure CSS Mixin for Displaying Values of Custom Properties” kizu.dev/preview-mixin Do you write #CSS? Do you use custom properties with calculations? Do you want to preview their values while […] [Original post on front-end.social]

A photo of a screen, a bit tilted, and showing an example with a list of multiple values followed by their computed values with a dotted outline. Above, a bit out of focus, the source code for this example's HTML can be seen: a list, with list items having inline styles, each starting from `--preview` and the rest being too blurry to read.

The text visible on the example itself (the one with the values and computed values):

— 1rem = 18px.
— 1em = 23px.
— 1lh = 36px.
— 1rad = 57.296deg.
— 100vw = 1920px.
— 𝝅 ≈ 3.142.
— 𝝉 ≈ 6.283.
— var(--PINK)… and the rest is out of frame.

376 7

Roma Komarov @kizu.front-end.social.ap.brid.gy · 09/01/2025

@Jbasoo Mastodon now has exclusive lists: when the option “Hide these posts from home” is set, the main timeline won't contain the posts from people in that list. I have an “Overflow” list that I sometimes add someone if I feel that I don't want to unfollow […] [Original post on front-end.social]

A screenshot of the Mastodon UI: on top is a left-pointing arrow with a title “Overflow”. Below, two buttons: “Edit list” and “Delete list”. Below, a toggle switch turned on with the label “Hide these posts from home”.

100 1

Roma Komarov @kizu.front-end.social.ap.brid.gy · 06/01/2025

@argyleink I used it for many examples in this article: kizu.dev/tree-counting-and-random — and wrote an article about this back in 2017 :D kizu.dev/label-to-input One of my favorite obscure HTML&CSS interactions.

010 1

Roma Komarov @kizu.front-end.social.ap.brid.gy · 25/12/2024

@nicolaschevobbe BTW, a tiny bug report: when there is not enough vertical space, it does not overflow well :D

A Firefox devtools screenshot of the bottom of the tooltip, showing the content spilling out of it.

000 0

Roma Komarov @kizu.front-end.social.ap.brid.gy · 25/12/2024

That feeling when you just play with colors (nerd sniped by @leaverou) codepen.io/kizu/pen/azowXwm

A screenshot of a Firefox devtools for a `background` property which has a `rgb(var(--rgb))` value (visible as pink). The tooltip is shown for the `--rgb` custom property, showing the `var(--r3), var(--g3), var(--b3)` on top, and then a very long computed value taking the rest of the screen.

100 1

Roma Komarov @kizu.front-end.social.ap.brid.gy · 24/12/2024

I wrote a new article: “Indirect Cyclic Conditions: Prototyping Parametrized CSS Mixins” kizu.dev/indirect-cyclic-conditions In my quest to push forward what is possible with custom properties in #CSS, I discovered another application of cyclic […] [Original post on front-end.social]

A photo of the screen, zoomed onto a scheme that shows several blocks with solid and dashed arrows going between them. Most of the photo is out of focus, with the `--resize3` visible in the middle.

123 3