I came across a few challenges when creating this.
The images and text within the container are occupying the entire flex box. Every time I tried creating another flex box for the container to be in, it would mess everything up. the reason for doing this is so I can create the gaps between the image/text and the outer border.
Another challenge I faced was making the image stay a static size. It grows with the page so when I coded the original flex box it looked as intended until re-sizing the screen. It's way bigger than originally designed and I can't figure out how to keep it a static size without messing up all the content within the flexbox.
I tried getting the live site via GitHub desktop but the image would not upload in GitHub. Every time I tried adding the image it seems that the img would not actually import into the html even though I've added it to the repository. Maybe it's a directory issue and I didn't add a full directory for the image? Not sure.
Any advice on the code or better practice adjustments would be greatly appreciated.
*Edit
After receiving feedback from a community member, I was able to apply new found knowledge and techniques to get my project to further resemble the original design. This was a great learning experience and I feel like I understand flex box a lot better. This also helped me dive a little bit further into using Github properly and linking things within Github's repository.