JSFiddle - React, Tailwind, and code Playground

by karthick6891

HTML

<!-- float practice -->
<div class="container">
    <div class="child-1">
        <p>I am child 1</p>
    </div>
    <div class="child-2">
        <p>I am child 1</p>
    </div>
</div>

CSS

*{
    margin:0;
    padding: 0;
    box-sizing: border-box;
}
*:before,
*:after {
    box-sizing: border-box;    
}
.container {
    float: left;
    width: 600px;
    height: 200px;
    border: 1px solid #efefef;
    margin: 0 auto;
    background-color: gray;
}
[class*='child-']{
    display: block;
    border: 1px solid #bcbcbc;
    text-align: center;
}