JSFiddle - React, Tailwind, and code Playground
HTML
<h2>SERVERS:</h2>
<!--I want each set of H3 and P to be on the same line-->
<h3>Server 1 Status:</h3>
<p id="running">Running</p>
<div class="clear"></div>
<h3>Server 2 Status:</h3>
<p id="notRunning">Not Running</p>
<div class="clear"></div>
<h3>Server 3 Status:</h3>
<p id="running">Running</p>
CSS
#running {
color:green;
font-weight:bold;
}
#notRunning {
color:red;
font-weight:bold;
}
p, h3 {
display:inline-block;
line-height:20px;
background-color:#ccc;
}
.clear {
clear:both;
height:0;
}