Live data from Hacker News

Minding the gaps: A new way to draw separators in CSS

blogs.windows.com

91–99 of 99 posts

Re: Minding the gaps: A new way to draw separators in CSS

#92

I would create new pseudo elements: .container:gap { background-color: red; } This will allow for more fancy backgrounds (e.g. dotted or gradients) and using { padding: 2px } to set whitespace at ends of the seperator. Possible with a :gap-horz and :gap-vert (or whatever css like to name it) to get seperate vertical and horizontal gaps. Also: .container:gap:nth-gap(2n) { color: blue; } to get alternating colors.

Isn't it (technically, officially) two colons for a pseudo-element? ::gap instead of :gap.

I believe that was deprecated for reasons I don't understand, but admittedly, I'm too lazy to check since I'm on my phone.

Re: Minding the gaps: A new way to draw separators in CSS

#93
post #25

Earlier quoted context omitted.

No, because a ruler is completely different from a rule.

No? Both "rule" and "ruler" can denote this thing also called straightedge; but the word "ruler" is more commonly used in this sense, while "rule" generally means an instruction.

I'm not sure about the real etymology, but I suppose a rule (line) is a special case of a rule (instruction): things should be aligned with this line.

Re: Minding the gaps: A new way to draw separators in CSS

#94

I would create new pseudo elements: .container:gap { background-color: red; } This will allow for more fancy backgrounds (e.g. dotted or gradients) and using { padding: 2px } to set whitespace at ends of the seperator. Possible with a :gap-horz and :gap-vert (or whatever css like to name it) to get seperate vertical and horizontal gaps. Also: .container:gap:nth-gap(2n) { color: blue; } to get alternating colors.

I think a `gap-image`, similar to `border-image` would be more flexible.

Re: Minding the gaps: A new way to draw separators in CSS

#95

Earlier quoted context omitted.

> Indeed a “CSS rule” is already a thing and it has nothing to do with lines. Shouldn't make a difference; we had the element ` ` (horizontal rule) since before CSS, after all.

honestly didn't know hr actually stood for that, huh

A ruler is an object that helps you draw lines.

It's also the monarch that makes the rules, but even the rules help you stay within the lines.

Re: Minding the gaps: A new way to draw separators in CSS

#96
post #24
post #22

Earlier quoted context omitted.

I remember this argument from the 90s where large numbers of people were upset at having to learn the world "Font". What it came down to was, either you use the correct existing term, or you create a new term and end up with constant conflict between the two. These days everyone knows what a font is.

Funnily the word "font" is in fact now used in digital publishing for what is more properly called "typeface". In traditional typesetting "font" refers to one specific size, weight and style of a typeface. That is, Helvetica is a typeface, Helvetica Light Oblique 12pt is a font.

The way a word is typically used is its general meaning, even if it has a different meaning in some technical circles.

Re: Minding the gaps: A new way to draw separators in CSS

#97

Earlier quoted context omitted.

No? Both "rule" and "ruler" can denote this thing also called straightedge; but the word "ruler" is more commonly used in this sense, while "rule" generally means an instruction.

I'm not sure about the real etymology, but I suppose a rule (line) is a special case of a rule (instruction): things should be aligned with this line.

More than a line I think the evolution is along the lines of

- there is a decision on how to measure things ( this affects prices taxes and commerce )

- there is an association between the power to enforce a standard and the instruments of that standard

- the measure instruments are generally very straight

Re: Minding the gaps: A new way to draw separators in CSS

#98

Earlier quoted context omitted.

Frames and tables were awesome, useful, and simple to learn. While they had their problems, really they just became unfashionable and the result has been a million efforts to replicate what we already had.

a few days ago, I saw a very old web application that had a f** table inside of a button to center a with an icon, with a text.

[deleted]

Re: Minding the gaps: A new way to draw separators in CSS

#99
post #37

Earlier quoted context omitted.

I often set gaps between elements to 1rem or more. Coloring the gap wouldn’t be the same as adding a rule. My “theory of layout” is that no element should have any styling that relates to its relationship with other elements. Gap is very useful for establishing spacing.

Perhaps with margin: auto your :gap element can sit in the middle of the “gap space”?

I think we’re getting into kludge territory there. Might as well have an explicit property that can be autocompleted/stumbled upon via spec or docs than an implicit behavior born of a little trick.
Post reply on HN