Can the text be formatted in a specific location on the page, separate from the image and heading?
This is the HTML code I am currently using:
<div class="tab-pane container fade" id="environmental">
<div class="row">
<div class="content-info col col-sm-6 no-l-padding">
<h3 class="red-title">ENVIRONMENTAL</h3>
<div class="container">
<div class="row">
<div class="col-sm-6">
<li class="list-item"><img class="heat" src="http://dubai.themyriad.com/wp-content/uploads/2020/02/heat.png">UV RATED WALLS – HEAT TRANSMISSION REDUCTION
</li>
<li class="list-item"><img class="air_window" src="http://dubai.themyriad.com/wp-content/uploads/2020/02/air_window.png">DOUBLE GLAZED WINDOWS – COOL AIR CONTAINMENT
</li>
<li class="list-item"><img class="low_energy" src="http://dubai.themyriad.com/wp-content/uploads/2020/02/low_energy.png">LOW ENERGY CONSUMING HEAT PUMPS
</li>
</div>
<div class="col-sm-6">
<li class="list-item"><img class="solar_panel" src="http://dubai.themyriad.com/wp-content/uploads/2020/02/solar_panel.png">SOLAR PANELS SPACE
</li>
<li class="list-item"><img class="sensor" src="http://dubai.themyriad.com/wp-content/uploads/2020/02/sensor.png">OCCUPANCY SENSORS TO CONTROL LIGHTING AND AC – BOTH IN-ROOM AND THROUGHOUT COMMON AREAS
</li>
<li class="list-item"><img class="shower" src="http://dubai.themyriad.com/wp-content/uploads/2020/02/shower.png">WATER CONSERVING SHOWERHEADS
</li>
</div>
</div>
</div>
Currently, the layout appears like this:
https://i.sstatic.net/mnFNl.png
However, I would like it to appear as shown here:
https://i.sstatic.net/cznVU.png