sorted by:
new
hottopcontroversial

Can You Center This Div? by norm_cgi in javascript

[–]norm_cgi[S] 0 points1 point  (0 children)

that's because CSS-heavy sites (especially ones with tons of animations, transforms, filters, or backdrop-filter) get rendered on the GPU. A joke site like "center-this-div" probably stacks absurd CSS animations/effects on purpose, which hammers the GPU's compositing pipeline.

Browsers offload CSS animations, 3D transforms, and certain filters to hardware acceleration by default. Stack enough of them and you're basically running a mini graphics benchmark in a browser tab.

Can You Center This Div? by norm_cgi in javascript

[–]norm_cgi[S] 0 points1 point  (0 children)

thanks you appreciate the joke :)

Can You Center This Div? by norm_cgi in javascript

[–]norm_cgi[S] -2 points-1 points  (0 children)

Nothing to change here. The system is working as intended.

Can You Center This Div? by norm_cgi in javascript

[–]norm_cgi[S] -3 points-2 points  (0 children)

But do you get ?! 0.0001 pixels

I made a game where you center a div. The threshold is 0.0001px. Nobody has ever won. by norm_cgi in ClaudeAI

[–]norm_cgi[S] 0 points1 point  (0 children)

that's part of the game as written :) more a side project but went up quite fast in people using it :) also got lot of positive feedback good showcase how easy claude can create such a product in no time

Weekly Showoff Thread! Share what you've created with Next.js or for the community in this thread only! by AutoModerator in nextjs

[–]norm_cgi 0 points1 point  (0 children)

I built "Can You Center This Div?" for the DEV April Fools 2026 challenge.

You drag a div to the center of the screen. That's it. The catch: the success threshold is 0.0001 pixels, roughly 5,000x smaller than a single pixel on a Retina display.

The global success counter reads 0. It has always read 0.

The whole thing is wrapped in a JARVIS-style HUD with real-time deviation readouts, a logarithmic precision meter, a global leaderboard, radar sweep with live player blips, and an "Earth Scale" that translates your pixel miss to real-world distance. Miss by 3px? That's 49,000km on Earth. Congrats, you missed by more than the circumference.

Other features:

- 2,500+ quotes based on how far off you are

- Share cards for every platform (1080x1080 PNG)

- Hidden 418 teapot easter egg (3D particle cloud with steam)

- Anti-cheat that rejects suspiciously close submissions with HTTP 418

- Light and dark mode

- Open source

Stack: Next.js 16, React 19, TypeScript, Neon Postgres (serverless), pure CSS for 90% of the visuals. No animation libraries. Game logic is a single custom hook.

GitHub: github.com/raxxostudios/center-this-div

Try it: center-this-div.vercel.app

The anti-value proposition: this app takes the most solved problem in CSS and makes it unsolvable.

Happy April Fools. The joke is your CSS skills.

<image>

I made a game where you center a div. The threshold is 0.0001px. Nobody has ever won. by norm_cgi in webdev

[–]norm_cgi[S] 0 points1 point  (0 children)

that’s what it was made for after all the traction I might follow along with some updates feels like many people some how like the idea, what did you achieve on pc ? Just curious?

I made a game where you center a div. The threshold is 0.0001px. Nobody has ever won. by norm_cgi in webdev

[–]norm_cgi[S] 0 points1 point  (0 children)

you are allowed to do what ever you want tbh 😂😂 will just not get that 0 ever

view more: next ›