JSFiddle - React, Tailwind, and code Playground

by akang2

HTML

<div class="part">
    <p>Do you see any Teletubbies in here? Do you see a slender plastic tag clipped to my shirt with my name printed on it? Do you see a little Asian child with a blank expression on his face sitting outside on a mechanical helicopter that shakes when you put quarters in it? No? Well, that's what you see at a toy store. And you must think you're in a toy store, because you're here shopping for an infant named Jeb.</p>
</div>

<div class="part2">
    <ul>
        <li>bleh</li>
        <li>bleh</li>
        <li>bleh</li>
        <li>bleh</li>
    </ul>
</div>

CSS

.part {
    max-width: 600px;
    float: left;
}

.part2 {
    max-width: 100px;
    float: left;
}

@media screen and (min-width:300px) and (max-width:500px)
{
	/*put your shit here*/
    .part {
        background-color: red;
    }
}