# Learn CSS Flexbox by Building a Photo Gallery - Step 24 **URL:** \ **Category:** Curriculum Help\ **Created:** [February 18, 2024, 12:12pm UTC](https://forum.freecodecamp.org/t/learn-css-flexbox-by-building-a-photo-gallery-step-24/673240 "2024-02-18T12:12:26Z")\ **Posts on this page:** 5\ **Page:** 1
**Author:** ![wailwinpaing6](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/wailwinpaing6/32/347967_2.png) [@wailwinpaing6](https://forum.freecodecamp.org/u/wailwinpaing6)\ **Post date:** [February 18, 2024, 12:12pm UTC](https://forum.freecodecamp.org/t/learn-css-flexbox-by-building-a-photo-gallery-step-24/673240/1 "2024-02-18T12:12:27Z")
### Tell us what’s happening: Describe your issue in detail here. ### Your code so far ```html Photo Gallery

css flexbox photo gallery

catphoto catcute catsleep catlooking catliving babycat catbaby cat
``` ```css /* file: styles.css */ * { box-sizing: border-box; } body { margin: 0; font-family: sans-serif; background: #f5f6f7; } .header { text-align: center; text-transform: uppercase; padding: 32px; background-color: #0a0a23; color: #fff; border-bottom: 4px solid #fdb347; } .gallery { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; gap: 16px; max-width: 1400px; margin: 0 auto; padding: 20px 10px; } .gallery img { width: 100%; max-width: 350px; height: 300px; object-fit: cover; border-radius: 10px; } .gallery::after { content: ""; width: 350px; } ``` ### Your browser information: User Agent is: `Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36` ### Challenge Information: Learn CSS Flexbox by Building a Photo Gallery - Step 24 > **[freeCodeCamp.org](https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-css-flexbox-by-building-a-photo-gallery/step-24)** > > Learn to Code — For Free ---
**Author:** ![system](https://global.discourse-cdn.com/freecodecamp/original/3X/e/1/e1c433102e34b46dfaa3e15d13ab9a514b127078.svg) [@system](https://forum.freecodecamp.org/u/system)\ **Post date:** [February 18, 2024, 12:12pm UTC](https://forum.freecodecamp.org/t/learn-css-flexbox-by-building-a-photo-gallery-step-24/673240/2 "2024-02-18T12:12:27Z")
You appear to have created this post without editing the template. Please edit your post to **Tell us what’s happening** in your own words. Learning to describe problems is hard, but it is an important part of learning how to code. Also, the more you say, the more we can help! ---
**Author:** ![bappyasif](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/bappyasif/32/190571_2.png) [@bappyasif](https://forum.freecodecamp.org/u/bappyasif)\ **Post date:** [February 18, 2024, 12:36pm UTC](https://forum.freecodecamp.org/t/learn-css-flexbox-by-building-a-photo-gallery-step-24/673240/3 "2024-02-18T12:36:16Z")
hello and welcome to fcc forum 🙂 > [@wailwinpaing6](#): > > `` - “alt” attribute is missing happy coding 🙂 ---
**Author:** ![hasanzaib1389](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/hasanzaib1389/32/377602_2.png) [@hasanzaib1389](https://forum.freecodecamp.org/u/hasanzaib1389)\ **Post date:** [February 18, 2024, 12:40pm UTC](https://forum.freecodecamp.org/t/learn-css-flexbox-by-building-a-photo-gallery-step-24/673240/4 "2024-02-18T12:40:39Z")
Following @bappyasif guide, you also need to add at least 5 words as value with your each alt attribute. And all nine alt value should be different. @wailwinpaing6 ---
**Author:** ![system](https://global.discourse-cdn.com/freecodecamp/original/3X/e/1/e1c433102e34b46dfaa3e15d13ab9a514b127078.svg) [@system](https://forum.freecodecamp.org/u/system)\ **Post date:** [August 19, 2024, 12:40am UTC](https://forum.freecodecamp.org/t/learn-css-flexbox-by-building-a-photo-gallery-step-24/673240/5 "2024-08-19T00:40:41Z")
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.