frontpage.
newsnewestaskshowjobs

Made with ♥ by @iamnishanth

Open Source @Github

fp.

eInk UI Components in CSS

https://eink-components.dev/
1•edent•43s ago•0 comments

Discuss – Do AI agents deserve all the hype they are getting?

1•MicroWagie•3m ago•0 comments

ChatGPT is changing how we ask stupid questions

https://www.washingtonpost.com/technology/2026/02/06/stupid-questions-ai/
1•edward•4m ago•0 comments

Zig Package Manager Enhancements

https://ziglang.org/devlog/2026/#2026-02-06
2•jackhalford•5m ago•1 comments

Neutron Scans Reveal Hidden Water in Martian Meteorite

https://www.universetoday.com/articles/neutron-scans-reveal-hidden-water-in-famous-martian-meteorite
1•geox•6m ago•0 comments

Deepfaking Orson Welles's Mangled Masterpiece

https://www.newyorker.com/magazine/2026/02/09/deepfaking-orson-welless-mangled-masterpiece
1•fortran77•8m ago•1 comments

France's homegrown open source online office suite

https://github.com/suitenumerique
3•nar001•10m ago•1 comments

SpaceX Delays Mars Plans to Focus on Moon

https://www.wsj.com/science/space-astronomy/spacex-delays-mars-plans-to-focus-on-moon-66d5c542
1•BostonFern•10m ago•0 comments

Jeremy Wade's Mighty Rivers

https://www.youtube.com/playlist?list=PLyOro6vMGsP_xkW6FXxsaeHUkD5e-9AUa
1•saikatsg•11m ago•0 comments

Show HN: MCP App to play backgammon with your LLM

https://github.com/sam-mfb/backgammon-mcp
1•sam256•13m ago•0 comments

AI Command and Staff–Operational Evidence and Insights from Wargaming

https://www.militarystrategymagazine.com/article/ai-command-and-staff-operational-evidence-and-in...
1•tomwphillips•13m ago•0 comments

Show HN: CCBot – Control Claude Code from Telegram via tmux

https://github.com/six-ddc/ccbot
1•sixddc•14m ago•1 comments

Ask HN: Is the CoCo 3 the best 8 bit computer ever made?

1•amichail•16m ago•0 comments

Show HN: Convert your articles into videos in one click

https://vidinie.com/
2•kositheastro•19m ago•0 comments

Red Queen's Race

https://en.wikipedia.org/wiki/Red_Queen%27s_race
2•rzk•19m ago•0 comments

The Anthropic Hive Mind

https://steve-yegge.medium.com/the-anthropic-hive-mind-d01f768f3d7b
2•gozzoo•22m ago•0 comments

A Horrible Conclusion

https://addisoncrump.info/research/a-horrible-conclusion/
1•todsacerdoti•22m ago•0 comments

I spent $10k to automate my research at OpenAI with Codex

https://twitter.com/KarelDoostrlnck/status/2019477361557926281
2•tosh•23m ago•1 comments

From Zero to Hero: A Spring Boot Deep Dive

https://jcob-sikorski.github.io/me/
1•jjcob_sikorski•24m ago•0 comments

Show HN: Solving NP-Complete Structures via Information Noise Subtraction (P=NP)

https://zenodo.org/records/18395618
1•alemonti06•29m ago•1 comments

Cook New Emojis

https://emoji.supply/kitchen/
1•vasanthv•31m ago•0 comments

Show HN: LoKey Typer – A calm typing practice app with ambient soundscapes

https://mcp-tool-shop-org.github.io/LoKey-Typer/
1•mikeyfrilot•34m ago•0 comments

Long-Sought Proof Tames Some of Math's Unruliest Equations

https://www.quantamagazine.org/long-sought-proof-tames-some-of-maths-unruliest-equations-20260206/
1•asplake•35m ago•0 comments

Hacking the last Z80 computer – FOSDEM 2026 [video]

https://fosdem.org/2026/schedule/event/FEHLHY-hacking_the_last_z80_computer_ever_made/
2•michalpleban•35m ago•0 comments

Browser-use for Node.js v0.2.0: TS AI browser automation parity with PY v0.5.11

https://github.com/webllm/browser-use
1•unadlib•36m ago•0 comments

Michael Pollan Says Humanity Is About to Undergo a Revolutionary Change

https://www.nytimes.com/2026/02/07/magazine/michael-pollan-interview.html
2•mitchbob•37m ago•1 comments

Software Engineering Is Back

https://blog.alaindichiappari.dev/p/software-engineering-is-back
2•alainrk•37m ago•1 comments

Storyship: Turn Screen Recordings into Professional Demos

https://storyship.app/
1•JohnsonZou6523•38m ago•0 comments

Reputation Scores for GitHub Accounts

https://shkspr.mobi/blog/2026/02/reputation-scores-for-github-accounts/
2•edent•41m ago•0 comments

A BSOD for All Seasons – Send Bad News via a Kernel Panic

https://bsod-fas.pages.dev/
1•keepamovin•45m ago•0 comments
Open in hackernews

Fizz Buzz in CSS

https://susam.net/fizz-buzz-in-css.html
110•froober•2mo ago

Comments

kevinsync•2mo ago
I love this, it's a very clever and funny way to solve the problem. Makes me think about how there are infinite routes from A to B, some more scenic and whimsical than others.. as well as all the people I've met along the way who would be so pissed and pedantic about how this isn't a "real solution" LOL
hyperhello•2mo ago
The problem is that you have to define the problem enough to avoid the fact that it's trivial to output the string "1,2,Fizz,4,Buzz,......" and fulfill the assignment. You can, in fact, output "$1,$2,Fizz,$4,Buzz,..." where $ is any prefix itself divisible by 15 (there are other templates for the other situations but it clearly does repeat endlessly.)
susam•2mo ago
A shorter solution is possible with an ordered list (<ol>) if we're willing to ignore the untidy output:

  li:nth-child(3n), li:nth-child(5n) { list-style: none }
  li:nth-child(3n)::before { content: "Fizz" }
  li:nth-child(5n)::after { content: "Buzz" }
Example: https://susam.net/code/web/css-fizz-buzz-ol.html

  $ curl -sS https://susam.net/code/web/css-fizz-buzz-ol.html | sed -n '/none/,/after/p' |  tr -d '[:space:]' 
  li:nth-child(3n),li:nth-child(5n){list-style:none}li:nth-child(3n)::before{content:"Fizz"}li:nth-child(5n)::after{content:"Buzz"}
  $ curl -sS https://susam.net/code/web/css-fizz-buzz-ol.html | sed -n '/none/,/after/p' |  tr -d '[:space:]' | wc -c
  129
But I don't quite like how misaligned the numbers and the words look in this version. Correcting that would call for extra code that would cancel out the characters saved.
cluckindan•2mo ago

    list-style-position: inside;
susam•2mo ago
Yes! However, like I mentioned in my previous comment, corrections like this cancel out the number of bytes saved with the <ol>-based solution.

I mean, the solution in the original post is 152 characters long.

The <ol> based solution is 129 characters long. Shorter but uglier.

If we add your correction, we get neater output, which is nice, but it comes at the cost of 30 additional characters in the minified code thereby making the solution 159 characters long.

  li { list-style-position: inside }
  li:nth-child(3n), li:nth-child(5n) { list-style: none }
  li:nth-child(3n)::before { content: "Fizz" }
  li:nth-child(5n)::after { content: "Buzz" }
carl_dr•2mo ago
Ignoring the size of the HTML in addition to the CSS, it’s fun, but not really fair when talking about code golf. Beyond a few numbers, you need to include some JavaScript and generating a million list elements. But those bytes count …
graiz•2mo ago
145 using P instead of li.

<style> p{counter-increment:n} p:not(:nth-child(5n)):before{content:counter(n)} p:nth-child(3n):before{content:"Fizz"} p:nth-child(5n):after{content:"Buzz"} </style><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p>

rebane2001•2mo ago
im not sure how you counted that as 145, but here's 137 for the css

<style>p{--n:counter(n);counter-increment:n;&:before{content:var(--n)};&:nth-child(5n){--n:"";&:after{content:"Buzz"}}&:nth-child(3n){--n:"Fizz"</style><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p><p>

dsmmcken•2mo ago
144, using css variables, with fallback and p instead of li

https://codepen.io/dsmmcken/pen/WbwYOEQ?editors=0100

p{counter-increment:n;--n:counter(n)}p:nth-child(3n){--f:"Fizz"}p:nth-child(5n){--b:"Buzz";--n:''}p::after{content:var(--f,var(--n))var(--b,'')}

genezeta•2mo ago
To nitpick a bit, I'd say there is something that is "placed outside the stylesheet".

Now, arguably it's not a "number or word that appears in the output", that's true, but it is a part of the logic of FizzBuzz. It's the fact that there are 100 and exactly 100 <li> elements in the HTML part.

I mean, it wouldn't be a correct FizzBuzz without precisely that HTML. Having exactly 100 <li> elements is implementing the part of the logic that a. loops, and b. stops at 100.

But of course this is just nitpicking, as I said ;)

culi•2mo ago
HTML is just the runtime of CSS
Metaboat•2mo ago
104 :nth-child(3n){list-style:"Fizz"}:nth-child(5n){list-style:"Buzz"}:nth-child(15n){list-style:"FizzBuzz"}

data:text/html,<style>:nth-child(3n){list-style:"Fizz"}:nth-child(5n){list-style:"Buzz"}:nth-child(15n){list-style:"FizzBuzz"}</style><ol id=o><script>o.innerHTML='<li>'.repeat(99)</script>

Metaboat•2mo ago
103 :nth-child(3n){list-style:"Fizz"}:nth-child(5n){list-style:"Buzz"}:nth-child(15n){list-style:"FizzBuzz"
Metaboat•2mo ago
98 :nth-child(5n){list-style:""}:nth-child(3n){list-style:"Fizz"}:nth-child(5n)::after{content:"Buzz"
Metaboat•2mo ago
95 :nth-child(5n){list-style:}:nth-child(3n){list-style:"Fizz"}:nth-child(5n)::after{content:"Buzz
Metaboat•2mo ago
68 :nth-child(3n){list-style:"Fizz"}:nth-child(5n)::after{content:"Buzz
eurleif•2mo ago
67 :nth-child(3n){list-style:"Fizz"}:nth-child(5n):after{content:"Buzz
Metaboat•2mo ago
thank you sir! i can improve the html op css was 152, we have the whole page at 144

data:text/html,<ol id=o><script>o.innerHTML='<li>'.repeat(100)</script><style>:nth-child(3n){list-style:"Fizz"}:nth-child(5n):after{content:"Buzz

throwaway150•2mo ago
Your code is showing the numbers 5, 10, 20. that's not correct, is it?

Yours prints 1. 2. Fizz 4. 5. Buzz Fizz 7.

But it should be 1. 2. Fizz 4. Buzz Fizz 7.

bulmenisaurus•2mo ago
This version fails for numbers like 5, showing "5. Buzz". In the case of a number divisible by 5 but not 3 nothing prevents the 5 in the ::marker from rendering.

Edit: it looks like your version can be fixed into a working 85:

  :nth-child(5n){list-style:'';&:after{content:"Buzz"}}:nth-child(3n){list-style:"Fizz"
cefqrn•2mo ago
89: :nth-child(3n)::marker{content:"Fizz"var(--b,)}:nth-child(5n){list-style:"Buzz";--b:"Buzz

with help from @bulmenisaurus

smrq•2mo ago
Am I the only one here who's never seen CSS counters before? Interesting feature, what are they useful for practically?