My social icons aren't aligning with content above

Issue

I've tried a few things here. I created the content in its own ul class, I've tried it inside the hero_text div, I've used this first snippet below and I have also explored other flexbox justify-content and align items. I've looked through the code for any errant margin-left but I didn't find anything that looked like it was impacting this.

I originally had these social links in the footer, and the issue persisted. I thought that trying it in another area I could attempt to find the problem and fix it, but I have not been able to figure it out.

.

Solution

I analyzed all of this and rest of code which is also present on your github account. there are only some line of code was missing:

        <!--footer-->
<aside> 
        <footer> 
      <ul class="social-media"> 
        <li><a href="https://www.linkedin.com/in/vicdearanzeta" target="_blank"><img src="Logo/mdi_linkedin.svg" width="32px" height="32px" class="linkedin" alt="linkedin"></a></li>
        <li><a href="https://github.com/vdaranze" target="_blank"><img src="Logo/mdi_github.svg" width="32px" height="32px" class="github" alt="github"></a></li>
        <li><a href="https://www.artstation.com/vicdearanzeta" target="_blank"><img src="Logo/mdi_artstation.svg" width="32px" height="32px" class="artstation" alt="artstation"></a></li>
      </ul>
   <p class="copyright">&copy;2023 Vic de Aranzeta</p>
</footer>
</aside>

In html File i just added a class in ul class="social-media" and then i applied CSS on this. In CSS file added code is given below:

.social-media{
    display: flex;
    /* border: 5px solid white; */
    justify-content: center;
}

This Will solve your Icons Align Problem.

    .copyright{
    text-align: center;
}

This line you can also add if you want to make this line of code(written below) center with icons.

enter code here
<p class="copyright">&copy;2023 Vic de Aranzeta</p>

Answered By - Ajay Mahiwal