Is nth-of-type styling possible?

Hi folks

I am currently working with CodeMirror 5 to build a hex editing app for some custom work. At the moment I am manually adding spaces after every fourth hex character to build columns into the app. That is a less-than-optimal solution and I was wondering if there was some way to do something similar to nth-of-type CSS styling? I was looking through the docs (for 5) and found ways to mark and style text but nothing that appears to let me add a style in the manner I am trying to do.

I’ve got no issues moving to 6 if that is necessary and I am also happy with being told that it isn’t possible :slight_smile:

TIA

I’m not entirely sure what you’re trying to do, but I think an overlay would be able to add a style to every Nth character on a line.

I have long strings of hex data that I want to display in columns of 4 bytes

So instead of

416C69636F726E00000000000000
0000000000000000000000000000
0000000000000000000000000000
0000000000000000000000000000

I want something that looks like

416C 6963 6F72 6E00 0000 0000 0000
0000 0000 0000 0000 0000 0000 0000 
0000 0000 0000 0000 0000 0000 0000 
0000 0000 0000 0000 0000 0000 0000 

I can do it by adding a space after every fourth character but then that makes the rest of the app a bit of a PITA since I want mark specific 2 and 4 byte pairs.

I am trying to avoid having to write code to ignore the spaces I add and to also take them into consideration when I try to style, for example, characters 54 to 58

Ah, I see. Overlays can only add styling to text, so that doesn’t work. But you could write code that uses setBookmark to insert widgets that are rendered as a single space, and then make sure you update those as the document is changed.