JSFiddle - React, Tailwind, and code Playground

by ackernaut

HTML

<main>
    <div>
        <article>
            <section>
                <span>
                    <b>Hi</b>
                </span>
            </section>
        </article>
    </div>
</main>

CSS

* {
    font-family: sans-serif;
    line-height: 30px;
    text-align: center;
}
main {
    background-color: #ccc;
    background-image: linear-gradient(90deg, transparent 50%, rgba(255,255,255,.5) 50%);
    background-size: 60px 60px;
    border: 30px dotted #f88;
    max-width: 330px;
}
div {
    border: 30px dotted #ff8;
}
article {
    border: 30px dotted #fb8;
}
section {
    border: 30px dotted #8f8;
}
span {
    display: block;
    border: 30px dotted #88f;
}
b {
    display: block;
    border: 30px dotted #f8b;
}