Skip to content

Youpinadi/cssfizzbuzz

Folders and files

NameName
Last commit message
Last commit date

Latest commit

b506549 · Mar 18, 2013

History

9 Commits
Mar 18, 2013
Mar 18, 2013

Repository files navigation

CSS FizzBuzz

CSS implementation of the infamous FizzBuzz. No counter used. You can check the result here

Reminder of the rules:

For numbers 1 through 100,

  • if the number is divisible by 3 print Fizz;
  • if the number is divisilbe by 5 print Buzz;
  • if the number is divisible by 3 and 5 (15) print FizzBuzz;
  • else, print the number.

CSS:

ol
{
    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';
}

HTML:

<ol>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ol>

About

CSS implementation of the infamous FizzBuzz

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published