JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <body style=" background-color:#cbe2ea">
        <div style="position: fixed; top: 0px; width: 100%;left:0px; height: 40px;background-color:#52c8f0;z-index:1">
            <div style="width:25%;float:left;height:32px;">
                <a href="AddAppointment.aspx">
                    <img src="Images/32/add.png"  style="padding:4px;" />
                </a>
            </div>
            <div style="width:50%;float:left;height:32px;text-align:center;">
                <label class="styletext" >Appointment</label>
            </div>
            <div style="width:25%;float:left;"><a href="MainMenu.aspx"> 
                <img src="Images/32/back_32.png" style="padding:4px;float:right;"/></a>
                <img id="Completed" src="Images/32/accept.png" style="padding:4px;float:right;"/>
            </div>
        </div>
        <div style="position: fixed; top: 40px; left:0px;background-color:#cbe2ea;height:10px;width:100%;z-index:1;"></div>
        <div style="position:relative;top:42px;left:0px; width: 100%; background-color:#cbe2ea">   
            <div class="DateClass">27-Jul</div>
        
        <div class="ContentClass">
            <div class="ChkClass">
                <input type="checkbox" id="CHK743"></div>
            <div class="DateTimeClass">04:00 A-05:00 P</div>
            <div class="SubjectClass">asdfasdfasd</div>
            <div class="clear"></div>
        </div>
        <div class="breakDiv"></div>
        <div class="DateClass">28-Jul</div>
        <div class="ContentClass">
            <div class="ChkClass">
                <input type="checkbox" id="CHK753"></div>
            <div class="DateTimeClass">12:00 A-12:00 A</div>
            <div class="SubjectClass">asdfasdfa</div>
            <div class="clear"></div>
        </div>
        <div class="breakDiv"></div>
        <div class="ContentClass">
            <div class="ChkClass">
                <input type="checkbox" id="CHK756">
            </div>
            <div...

CSS

.clear
{
    clear:both;
}
.ContentClass
{  
    background-color:White;
    width:80%;
    display:block;
}
.ChkClass
{
    float:left;
    left:0px;
    color:Red;
    width:40%;
    padding-left:5px;
    display:block;
}
.DateTimeClass
{
    color:Gray;
    font-family:Trebuchet MS;
    font-size:12px;
    text-align:right;
    float:right;
    padding-right:5px;
    width:40%;
    display:block;
}
.DateClass
{
    color:Gray;
    font-family:Trebuchet MS;
    font-size:16px;
    padding:5px;
    width:98%;
    display:block;
}
.DetailClass
{  
    color:Gray;
    font-family:Trebuchet MS;
    font-size:18px;
    white-space:pre-wrap;
    display:block;
}
.SubjectClass
{
    color:Gray;
    font-family:Trebuchet MS;
    font-size:14px;
    text-align:left;
    float:left;
    width:98%;
    padding-left:5px;
    display:block;
}
.breakDiv 
{
    height:8px;
    background-color:#cbe2ea;
}
.breakClass
{
    height:8px;
}