JSFiddle - React, Tailwind, and code Playground

by adouga

HTML

<html>
    <body>
<div id="bradShawDetail" class="nodeDetail">
   <p>
   <h1>Service</h1>
   Receive JCTC services
   </p>
   <p>
      <h1>Comments</h1>
      No DTEN services provided for over two years.
   </p>
</div>
<div id="raafTindalDetail" class="nodeDetail">
   <p>
   <h1>Service</h1>
   HACTS simulators
   </p>
   <p>
      <h1>Comments</h1>
      HACTS is primarily used for individual training. Only handles 25 entities so not really suited for large scale events.
   </p>   
</div>
<div id="delamereDetail" class="nodeDetail">
    <p>
        <h1>Service</h1>
        Receive JCTC services
    </p>
    <p>
        <h1>Comments</h1>
        For interaction with live aircraft, normally for EW training.
    </p>
</div>
<div id="robertsonBarracksDetail" class="nodeDetail">
    <p>
        <h1>Service</h1>
        Battle Simulation Centre
    </p>
    <p>
        <h1>Comments</h1>
        Receive JCTC services
    </p>
</div>
<div id="raafDarwinDetail" class="nodeDetail">
    <p>
        <h1>Service</h1>
        Task Unit HQ
    </p>
    <p>
        <h1>Comments</h1>
        Receive JCTC services.
    </p>
</div>
<div id="townsvilleRangeDetail" class="nodeDetail">
    <p>
        <h1>Service</h1>
        Range Control
    </p>
    <p>
        <h1>Comments</h1>
        Receive JCTC services.
    </p>
</div>
<div id="lavarackBarracksDetail" class="nodeDetail">
    <p>
        <h1>Service</h1>
        Battle Simulation Centre and Combat Training Centre
    </p>
    <p>
        <h1>Comments</h1>
        Receive JCTC services. Installation underway.
    </p>
</div>
<div id="stirlingDetail" class="nodeDetail">
    <p>
        <h1>Service</h1>
        ASMD simulators<br />Submarine simulators
    </p>
    <p>
        <h1>Comments</h1>
        Expect connection from around Aug 12. Expect connection from around Jul 12.
    </p>
</div>
<div id="womeraDetail" class="nodeDetail">
    <p>
        <h1>Service</h1>
        Receive JCTC services
    </p>
    <p>
       ...

CSS

.nodeDetail {
   text-align: left;
}