hello every one i wrote this code in html:
<div class="wrapper2">
<h2 class="footer"> <a href="#"> Content <br><p>Lorem, ipsum.</p><br><p class="p2">Lorem, ipsum.</p></a></h2>
<h2 class="footer"><a href="#"> information <br><p>Lorem, ipsum.</p><br><p class="p2">Lorem, ipsum.</p></a></h2>
<h2 class="footer"><a href="#"> legal <br><p>Lorem, ipsum.</p><br><p class="p2">Lorem ipsum dolor sit amet.</p></a></h2>
<h2 class="footer"><a href="#"> help <br><p>Lorem, ipsum.</p><br><p class="p2">Lorem, ipsum.</p></a></h2>
<h2 class="footer"><i class="fas fa-phone-alt"></i>3-6000-0000
-6000-000-0000</h2>
<h2 class="footer6"><i class="fas fa-map-marker-alt"></i>67700 Dagenham St
England, GB</h2>
</div>
and this is the css for it:
.wrapper2{
display: flex;
justify-content: space-between;
padding:20px;
background: #1f3138;
color: white;
}
.wrapper2 h2{
text-transform: uppercase;
}
.wrapper2 a{
text-decoration: none;
color: white;
}
.p2{
margin-top: -1em;
}
.wrapper2 i{
padding-right: 10px;
}
i made it display felx when i resize the page lower than 1920px width the h2 getinng close to each other and it is not making the space between can any one help please.