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

Hardest problem in computer science: centering things

tonsky.me

Post reply on HN
Print view View original

151–160 of 473 posts

Re: Hardest problem in computer science: centering things

#151

Post by PennRobotics »

silisili wrote: post #90
mrbluecoat wrote: post #30

It's just as hard in the real world: https://ftw.usatoday.com/lists/nc-state-texas-ncaa-portland-...

Here's my real world example that seemed to break everyone's brain...I had a room in a house that I wanted two ceiling fans installed in, in a line, with even spacing between the fans themselves and between the fans and the walls at each end. Everyone I called over to do said work said easy peasy, measure wall to wall, divide by 3, done and done. I tried to explain this centers the bases, but then the fans will be cl…

To better understand how people might get confused... Imagine a room 9 feet long and fans 2 feet in diameter. If you put them with bases equally spaced—3 feet apart—you get a gap 2 feet between the wall and fans… but 1 foot spaced apart in the middle.

Naively, you move each fan a half foot closer to the wall. This makes the gap 1.5 feet to the wall but now 2 feet between each other. (You might find ways to argue that this looks better visually than the true answer below, and that depends on a lot of perception-altering factors including how low the fan hangs from the ceiling, amount/ratio of space available, the distance from the non-perpendicular walls, and light sources as they might cast shadows with different sized gaps on the ceiling.)

You need to take the total room length and subtract the fan diameters, then divide that by 3. (So, 5 / 3 = 1.667 or 1'8" from wall to blade tip.) Thus, each base should be 2.667 feet from its nearest wall. This makes a gap 1'8" between each blade tip:

20" space, 24" blades, 20" space, 24" blades, 20" space = 108" (9 ft) room length

Bringing this around to the theme of web design, this is akin to space-between, space-around, and space-evenly in justify-content[1] (except there isn't a "space the center of each element evenly" selection, except maybe stretch or nesting everything in another flexbox)

[1] https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-j...

Re: Hardest problem in computer science: centering things

#152

Post by Stratoscope »

devjab wrote: post #126
Maxion wrote: post #98

Earlier quoted context omitted.

The same happens when you: - Install flooring - Install trim in your own home - Build / install cabinets You will now see: - Odd flooring patterns and uneven floors - Know what it looks like when trim isn't coped - Uneven gaps between doors

I’m not entirely sure I agree with you on this. It’s hard for me to say because I really like the imperfections in things I build, for the most part. Like I’ll full spartle a wall (not entirely sure if this is the correct English description) and I’ll intentionally leave the finish less than “perfect” because I think it adds a little soul to it that will make me happy down the years. Then you have things like floorin…

> You’re not going to ever build a perfect floor if you build it all the way to the wall. So what you do is that you leave a gap between the wall and the floor and you cover that gap up with wooden “footlists” (again not sure if that’s the correct English description). This gives you a “perfect” floor which aligns with everything in the room.

Here in the US, it's called “baseboard”:

https://www.google.com/images?q=baseboard

https://en.wikipedia.org/wiki/Baseboard

“[Baseboard's] purpose is to cover the joint between the wall surface and the floor. It covers the uneven edge of flooring next to the wall; protects the wall from kicks, abrasion, and furniture; and can serve as a decorative molding.”

Re: Hardest problem in computer science: centering things

#153

Post by Marlinski »

That bright yellow background imprinted my eyes for 5 minutes, there's other way to leave an impression than fucking up with my senses, like writing a clear concise article instead of a never ending list of examples interrupted with distracting fake mouse move.

An horrible web experience through and through.

Re: Hardest problem in computer science: centering things

#154

Post by reddalo »

Semaphor wrote: post #130

In case the author reads this: Please respect prefers-reduced-motion for your cute mouse cursors that wander over the screen in a very distracting fashion. In the meantime, as a fix for others, in uBo add tonsky.me##.pointers

Yes, I agree. It's a fun novelty the first 5 seconds, then it becomes completely annoying.

BTW: the movement of the small cursors is streamed live from the server, I think it represents the current mouse position from other readers.

Re: Hardest problem in computer science: centering things

#155

Post by watwut »

ozim wrote: post #109
Animats wrote: post #72

That's because CSS layout was designed by people who thought "float" and "clear" were a good idea, tables were bad, and, when in doubt, make it Turing-complete and dump the problem on someone else. 2D and 3D tools get this right. CAD programs, game engines, and animation programs are all far better at positioning things. They have far better layout engines and constraint systems. This is really a constraint problem.…

I don’t think it was that tables were bad. They were too formulaic and too strict and it was hard to do something that would stand out. With CSS it wasn’t dumping problem on the others, it was giving the freedom. Problem with freedom is that it is never free and you also have to fix additional problems that come with it.

The issue with CSS is not too much freedom. It is that as an API, it is frankly, retarded, horrible and ridiculous.

Re: Hardest problem in computer science: centering things

#156

Post by atoav »

ozim wrote: post #109
Animats wrote: post #72

That's because CSS layout was designed by people who thought "float" and "clear" were a good idea, tables were bad, and, when in doubt, make it Turing-complete and dump the problem on someone else. 2D and 3D tools get this right. CAD programs, game engines, and animation programs are all far better at positioning things. They have far better layout engines and constraint systems. This is really a constraint problem.…

I don’t think it was that tables were bad. They were too formulaic and too strict and it was hard to do something that would stand out. With CSS it wasn’t dumping problem on the others, it was giving the freedom. Problem with freedom is that it is never free and you also have to fix additional problems that come with it.

The problem I see with using tables for layout is that it fucks up the semantic meaning of the html file.

But that was an issue of philosophy that got trumped by practical needs.

However, nowadays we have css grids with template areas. So we can just write our HTML semantically correct as if it was more or less just about the content (as it should be IMHO) and still move things around using CSS depending on the type of device, size of screen, media used.

So the holy grail in my opinion is to write HTML that contains only content and metadata and next to no elements or attributes that are needed purely for semantically irrelevant layout and styling purposes — and then do all the layout and styling in CSS. Styling tags like or the occasional are okay, one should never be too strict with such ideals.

The advantage here is that this provides the maximum decoupling between the content and the layout/styling which not only helps with future layout updates, but improves the accessability of the page.

Re: Hardest problem in computer science: centering things

#157

Post by sph »

Marlinski wrote: post #153

That bright yellow background imprinted my eyes for 5 minutes, there's other way to leave an impression than fucking up with my senses, like writing a clear concise article instead of a never ending list of examples interrupted with distracting fake mouse move. An horrible web experience through and through.

I quite like the yellow. You should try and use your brightness slider, because it is not brighter than most real world yellow (i.e. illuminated by the sun which is orders of magnitude brighter than your screen)

Unless you are adapted to live in a darkened cave, that is.

Re: Hardest problem in computer science: centering things

#160

Post by red1reaper »

My biggest problem is that the dark mode flashlight looks bad, I can see the difference in color between the flashlight image darkness and the darkness created by the shadow, he should change the color of the box shadow from #000 to #010101 so it matches better the black of the flashlight image.

Sure, in a normal monitor it is not noticeable but in a good monitor with good blacks and HDR it is super noticeable

Post reply on HN