I need help with aligning two images horizontally with text below each image. This is the code I have so far:
HTML
<div class="selectGame">
<div id="computerIcon" class = "icon">
<img src="http://lorempixel.com" >
<span class ="iconText"><p>VS Computer</p></span>
</div>
<div id="humanIcon" class = "icon">
<img src="http://lorempixel.com" >
<span class ="iconText"><p>VS Human</p></span>
</div>
</div>
CSS
.icon img{
float: left;
width: 40%;
}
.iconText p{
clear: both;
}