JSFiddle - React, Tailwind, and code Playground

HTML

<div style="width: 700px;">

    <div style="float: left;">
        <div id="courses">
            <div class="mtitle">
            <h3><a href="http://moodle-new.barnet.ac.uk/course/">Courses</a></h3>
            </div>
            <div><img onmouseover="this.src='http://moodle-new.barnet.ac.uk/draftfile.php/663/user/draft/583404248/courses1.png';" onmouseout="this.src='http://moodle-new.barnet.ac.uk/draftfile.php/663/user/draft/583404248/courses.png';" src="http://moodle-new.barnet.ac.uk/draftfile.php/663/user/draft/583404248/courses.png" height="104" width="250" />
            </div>
        </div>
        
        <div id="support">
            <div class="mtitle">
            <h3><a href="http://moodle-new.barnet.ac.uk/support/">E-Library</a></h3>
            </div>
            <div><img src="http://moodle-new.barnet.ac.uk/draftfile.php/663/user/draft/583404248/support.png" height="92" width="250" />
            </div>
        </div>
        
</div>
    <div style="float: left;">
        <div id="elearning">
            <div class="mtitle">
            <h3><a href="http://moodle-new.barnet.ac.uk/my/">E-Learning</a></h3>
            </div>
            <div><img src="http://moodle-new.barnet.ac.uk/draftfile.php/663/user/draft/583404248/elearning.png" height="77" width="250" />
            </div>
        </div>
        <div id="moodle">
            <div class="mtitle">
            <h3><a href="http://moodle-new.barnet.ac.uk/my/">How to Moodle</a></h3>
            </div>
            <div><img src="http://moodle-new.barnet.ac.uk/draftfile.php/663/user/draft/583404248/moodle.png" height="119" width="250" />
            </div>
        </div>
    </div>
    
            <div id="storage">
        <div class="mtitle">
            <h3><a href="http://moodle-new.barnet.ac.uk/my/">Storage</a></h3>
            </div>
           <div><img src="http://moodle-new.barnet.ac.uk/draftfile.php/663/user/draft/583404248/storage.png" height="113" width="200" />
           </div>
 ...

CSS

#support{
    width: 250px;
    height: 120px;
    background-color: #78721e;
}

#courses{
    width: 250px;
    height: 130px;
    background-color: #ef7c00;
}

#elearning{
    width: 250px;
    height: 104px;
    background-color: #5771f8;
}

#storage
{
    float: left;
    width: 200px;
    height: 140px;
    background-color: #6603ba;
}
#moodle
{
    width: 250px;
    height: 146px;
    background-color: #c1ce00;
}
#facebook
{
    float: left;
    width: 100px;
    height: 55px;
    background-color: #5b2c87;
}
#twitter
{
    width: 100px;
    height: 55px;
    background-color: #5fcc1c;
}
#youtube
{
    float: left;
    width: 100px;
    height: 55px;
    bacbackground-color: #c1ce00;

}
#collegesite
{
    width: 100px;
    height: 55px;
    background-color: #5b2c1c;
}