JSFiddle - React, Tailwind, and code Playground

by Luiz Silva

HTML

<ul>
    <li>C</li>
    <li>C++</li>
    <li>Java</li>
    <li>PHP</li>
    <li>JavaScript</li>
    <li>Lisp</li>
    <li>Scheme</li>
    <li>Haskell</li>
    <li>Lua</li>
    <li>Python</li>
    <li>Ruby</li>
    <li>Delphi</li>
    <li>Cobol</li>
</ul>

CSS

ul {
    width: 500px;
    height: 350px;
    border: 1px solid red;
    margin: 0;
    text-align: center;
}

li {
    list-style: none;
    margin: 24px;
    display: inline-block;
    font-size: 2em;
}

JavaScript

function getRandomInt(min, max) {
  return Math.floor(Math.random() * (max - min + 1) + min);
}
function rand() {
    return getRandomInt(-20, 20);
}

$('li').each(function() {
    $(this).css({
        'position': 'relative',
        'left': rand() + 'px',
        'top': rand() + 'px',
    });
});