Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

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

blogs.windows.com

Post reply on HN
Print view View original

51–60 of 99 posts

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

#51

Post by IshKebab »

breckenedge wrote: post #40
IshKebab wrote: post #32

Earlier quoted context omitted.

A splitter is the widget that shows two (or more) panes with a divider that you can drag. Commonly used for side bar navigation, see this example: https://codepen.io/Zodiase/pen/qmjyKL A native splitter is one that is drawn by the browser itself, or even the OS. The only way to get that on the web is with iframes. Otherwise you have to resort to Javascript and manually handling mouse move events as in the example abo…

I believe you mean / rather than s, though you used to be able to do frames inside iframes. I’m surprised mobile Safari supports them. Example: https://www.quackit.com/html/templates/frames/frames_example...

Ah yes you're right! Similar to iframes anyway.

Your example has `noresize` set, but I found one that doesn't: https://www.yourhtmlsource.com/examples/frameset1.html

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

#52

Post by None4U »

pacifika wrote: post #12
krispyfi wrote: post #9

Earlier quoted context omitted.

> From Middle English reule, rewle, rule, borrowed from Old French riule, reule, from Latin regula (“straight stick, bar, ruler, pattern”), from regō (“to keep straight, direct, govern, rule”), ultimately from Proto-Indo-European h₃réǵeti (“to straighten; right”), from the root h₃reǵ-; see regent. Doublet of rail, regal, regula and rigol. https://en.m.wiktionary.org/wiki/rule#English

Thanks that's helpful to know they picked a valid term, but if I'd hold a no-context poll (unless I mention ruler) a significant number of people wouldn't know this.

There's already an element "horizontal rule" in HTML

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

#53

Post by lelanthran »

zarzavat wrote: post #48
Telemakhos wrote: post #20

Earlier quoted context omitted.

It’s the correct term from the technical vocabulary of book layout and printing. A rule is a line separating things on a page, while a border is a box.[0]. While the term originates in book printing shops, native English speakers would recognize it most easily from the terms “standard ruled” and “college ruled” as applied to loose-leaf notebook paper, describing the faint blue, printed horizontal lines providing guid…

While that may be true, I’ll say that as a native English speaker that reading is not the most obvious reading of “row rule”, which to me would be “A determinate method prescribed for performing any operation and producing a certain result.” Indeed a “CSS rule” is already a thing and it has nothing to do with lines.

> 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.

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

#54

Post by tasuki »

MortyWaves wrote: post #39
tasuki wrote: post #31

Note this was written by a "software engineer". A designer would have used white space for separation, not a line.

What are you even getting at here? Obviously that's how a "designer" or "software engineer" would display items that require whitespace between them. This proposal is for when you do want something other whitespace.

I'm getting at the fact that designers use white space to visually separate things. People who know nothing about design put lines between things to separate them.

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

#55

Post by istjohn »

IshKebab wrote: post #51
breckenedge wrote: post #40

Earlier quoted context omitted.

I believe you mean / rather than s, though you used to be able to do frames inside iframes. I’m surprised mobile Safari supports them. Example: https://www.quackit.com/html/templates/frames/frames_example...

Ah yes you're right! Similar to iframes anyway. Your example has `noresize` set, but I found one that doesn't: https://www.yourhtmlsource.com/examples/frameset1.html

It's not resizeable on mobile.

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

#56

Post by IshKebab »

istjohn wrote: post #55
IshKebab wrote: post #51

Earlier quoted context omitted.

Ah yes you're right! Similar to iframes anyway. Your example has `noresize` set, but I found one that doesn't: https://www.yourhtmlsource.com/examples/frameset1.html

It's not resizeable on mobile.

Yeah I mean, it was obsolete before the first iPhone so that's not surprising.

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

#57

Post by jeroenhd »

tasuki wrote: post #54
MortyWaves wrote: post #39

Earlier quoted context omitted.

What are you even getting at here? Obviously that's how a "designer" or "software engineer" would display items that require whitespace between them. This proposal is for when you do want something other whitespace.

I'm getting at the fact that designers use white space to visually separate things. People who know nothing about design put lines between things to separate them.

That sounds rather pretentious. There are good places to use whitespace and there are good places to use separators. There's a reason Excel uses lines to separate cells rather than whitespace and it's not because Microsoft never thought to hire a designer.

Going hard on whitespace is just a visual trend that'll undoubtedly change in the future again. It wasn't that long ago that designers went all in on glossy 3D effects with hard separators for basic UI design. You cannot derive someone's qualifications from a subjective aesthetical choice like that.

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

#59

Post by layer8 »

Telemakhos wrote: post #20
bung wrote: post #6

Earlier quoted context omitted.

Was just wondering that myself.. why they went with "rule" in `column-rule` and now `row-rule`

It’s the correct term from the technical vocabulary of book layout and printing. A rule is a line separating things on a page, while a border is a box.[0]. While the term originates in book printing shops, native English speakers would recognize it most easily from the terms “standard ruled” and “college ruled” as applied to loose-leaf notebook paper, describing the faint blue, printed horizontal lines providing guid…

While that is right, “divider” or “divider line” are common as well, and easier to search for. Try a search for “rule page layout” or “rule typography” or “rule css”.

Admittedly, we already have and .

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

#60

Post by bfgeek »

bung wrote: post #6
pacifika wrote: post #2

Design by committee is not the best but if you need one more view to be convinced, as a non native English speakers the property names proposed are not communicating the meaning very well. Eg Defining the gap but drawing the separator.

Was just wondering that myself.. why they went with "rule" in `column-rule` and now `row-rule`

Part of the design constraint here is to reuse the existing properties that exist for multi-column layout which have existed for a long time - https://developer.mozilla.org/en-US/docs/Web/CSS/column-rule

This proposal extends this mechanism to be more general.

Post reply on HN