JSFiddle - React, Tailwind, and code Playground

by wesbos

HTML

<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title>Demo - </title>
</head>
<body>

<div id="box1" class="box">Control</div>
<br/>
<div id="box2" class="box">Native Box Model</div>
<br/>
<div id="box3" class="box">box-sizing:border-box;</div>
    
</body>
</html>

CSS

.box {
    background: #bada55;
    width: 150px;
    height: 150px;
}

#box2 {
    border:2px solid red;
    padding:10px;
    margin:10px;}

#box3 {
    border:2px solid red;
    padding:10px;
    margin:10px;
 -webkit-box-sizing: border-box; 
 box-sizing: border-box; 
 -moz-box-sizing: border-box; }