After running the code, I noticed that the text "Text Here" is positioned at the bottom of the div instead of the top. I have attempted to adjust it using properties like vertical-align, padding, and margin-top within the .subText styling, but so far, I haven't been able to resolve the issue.
Here is the HTML and CSS code snippet:
#footballLeft {
float: left;
vertical-align: middle;
}
#footballRight {
float: right;
vertical-align: middle;
}
.subText {
text-align: center;
}<div class="sect sectTwo"></div>
<div id="footballSection" class="subSection">
<h1 class="titles">FOOTBALL</h1>
<div class="subSubSection">
<img src="img/teamhuddle.jpg" height="30%" width="30%" alt="Team Huddle" id="footballLeft" />
<img src="img/womens1.jpg" alt="Womens First Team" height="30%" width="30%" id="footballRight" />
<p class="subText">Text Here</p>
</div>
</div>