I'm working on my first web dev portfolio and I have currently have two screenshots of websites I've made. I'd like them to display very simply, gallery-style, so that on a larger screen they are in a row next to each other, or on a smaller screen they stack into a column. I figured Flexbox would be the best way to do this so that I can easily add more images at a later date and they can just continue to flow together. https://showbox.bio/ https://tutuapp.uno/ https://vidmate.vet/
I can see when I do "inspect" that the Flexbox CSS rules are in effect, and running my full code through the validator shows no errors. My suspicion is that I'm mis-understanding something about Flexbox, maybe something about how child elements interact with Flexbox parents? But I can't figure out why the images aren't displaying next to each other in the browser.
Here's the section of code I'm talking about, in case it helps describe what I'm trying to do: https://codepen.io/portugueseninja/pen/zYYmrwb
Thank you :)
Join 31,152+ developers who get early access to new screencasts, articles, guides, updates, and more.