JSFiddle - React, Tailwind, and code Playground

by quatzael

HTML

<div class="obal">
    <div class="datum">12. 4. 2014</div>
    <div class="text">
        <div class="text-a">Text A</div>
        <div class="text-b">Text B</div>
    </div>
    <div class="process"><input type="button" value="Odeslat" /></div>
</div>

CSS

.obal
{
width: 500px;
height: 36px;
color: black;
display: block;
background-color: #ee96f5;
}

.datum
{
width: 100px;
height: 36px;
color: white;
display: inline-block;
background-color: grey;
}

.text
{
position: relative;
width: 200px;
height: 36px;
display: inline-block;
background-color: green;
}

.text-a
{
width: 60px;
height: 36px;
display: inline-block;
background-color: red;
}

.text-b
{
width: 60px;
height: 36px;
display: inline-block;
background-color: blue;
}

.process
{
width: 100px;
height: 36px;
display: inline-block;
background-color: yellow;
}

.button
{
width: 110px;
height: 36px;
margin: 0px;
padding: 0px;
border: 0px; 
color: white;
font-size: 18px;
font-weight: bold;
background-color: transparent;
display: block;
}