JSFiddle - React, Tailwind, and code Playground

HTML

<H2>
   Plain float
</H2>
<div id="testA" class="demoContainer">
	<div class="propertyContainer">
		<span class="propertyName">color</span>
		<span class="propertyValue"><input type="color"></span>    
	</div>
	<div class="propertyContainer">
		<span class="propertyName">backround-color</span>
		<span class="propertyValue"><input type="color"></span>
	</div>
	<div class="propertyContainer">
		<span class="propertyName">border-color</span>
		<span class="propertyValue"><input type="color"></span>
	</div>
</div>

<H2>
   Float with container clear
</H2>
<div id="testB" class="demoContainer">
	<div class="propertyContainer">
		<span class="propertyName">color</span>
		<span class="propertyValue"><input type="color"></span>    
	</div>
	<div class="propertyContainer">
		<span class="propertyName">backround-color</span>
		<span class="propertyValue"><input type="color"></span>
	</div>
	<div class="propertyContainer">
		<span class="propertyName">border-color</span>
		<span class="propertyValue"><input type="color"></span>
	</div>
</div>

<H2>
   Float with clear hack
</H2>
<p>HTML must be changed or more complicated CSS hack to be used.</p>
<div id="testC" class="demoContainer">
	<div class="propertyContainer">
		<span class="propertyName">color</span>
		<span class="propertyValue"><input type="color"></span>
    <div class="clear"></div>
	</div>
	<div class="propertyContainer">
		<span class="propertyName">backround-color</span>
		<span class="propertyValue"><input type="color"></span>
    <div class="clear"></div>
	</div>
	<div class="propertyContainer">
		<span class="propertyName">border-color</span>
		<span class="propertyValue"><input type="color"></span>
    <div class="clear"></div>
	</div>
</div>

<H2>
   Plain flexbox
</H2>
<div id="testD" class="demoContainer">
	<div class="propertyContainer">
		<span class="propertyName">color</span>
		<span class="propertyValue"><input type="color"></span>    
	</div>
	<div class="propertyContainer">
		<span...

CSS

div.demoContainer, div.propertyContainer {
  border-style: solid;
  border-width: 1px;
  padding: 5px;
}

#testA .propertyName {
  float: left;
}
#testA .propertyValue {
  float: right;
}

#testB .propertyContainer {
  clear: both;
}

#testB .propertyName {
  float: left;
}
#testB .propertyValue {
  float: right;
}

#testC .propertyName {
  float: left;
}
#testC .propertyValue {
  float: right;
}
#testC .clear {
  clear: both;
}

#testD .propertyContainer {
  display: flex;
  justify-content: space-between;
}