JSFiddle - React, Tailwind, and code Playground

by Alireza Safian

HTML

<html>
<head>
<style>

body {
background-color:WHITE;
width: 960px centered;
}

.one {
background: #B1B4B5;
color: BLACK;
font-size: 60px;
width: 60px;
height: 60px;
overflow:hidden;
float:left;
position:absolute;
top: 0px;
left: 0px;
text-align: center;
}

.two {
background: #B1B4B5;
color: BLACK;
font-size: 60px;
width: 60px;
height: 60px;
overflow:hidden;
float:left;
position:absolute;
top: 0px;
left: 900px;
text-align: center;
}

.three{
background: #B1B4B5;
color: BLACK;
font-size: 60px;
width: 60px;
height: 60px;
overflow:hidden;
float:left;
position:absolute;
top: 500px;
left: 0px;
text-align: center;
}

.four {
background: #B1B4B5;
color: BLACK;
font-size: 60px;
width: 60px;
height: 60px;
overflow:hidden;
float:left;
position:absolute;
top: 500px;
left: 900px;
text-align: center;
}

</style>
</head>
<body>

<a class="one">1</a>
<a class="two">2</a>
<a class="three">3</a>
<a class="four">4</a>

</body>
</html>