Design comparison
Solution retrospective
i'm done! 2 days of work! 🤡 I have one question to you guys cause i wanted to do it a bit different but my limited knowledge and reasearch didn't let me do it 🥲 I have a huge question... How can I adjust the height of these three images at the bottom to occupy the exactly same height as the siblings div content?? I was trying to set the height as a 100% regarding to the content container (it's a class = 'article-content').. In other words, first I specified the dimension of the div class = ('article-content') content which is on the right side of the each picture and THEN i wanted to adjust exactly the same height with relative values instead of making my grid container 13fr and 30fr .... 🤡 I would be very appreciated if someone could help me with that! Thanks a lot and have a nice day!
Community feedback
- @dusan-bPosted about 2 years ago
Hey Milosz,
As far as I understand, you want
article-imgandarticle-contentto be the same height. To do that you could just change the value ofalign-itemstostretchonarticle-container. This wayarticle-contentwill always fit the height ofarticle-img.Hope this solves your problem. Feel free to ask, if something is not clear.
Keep it up, and happy coding. :)
1@yerbaMattePosted about 2 years agoHi Dusan, thats what i exactly want but in the opposite way. I want the height of the image to depend on the height of the article content, so for example if my article content is 200px height then article-img gets exactly this height as well. I can't decrease these images 'automatically' relying on the neighbour's content :/
Thank you for your message :)
0@dusan-bPosted about 2 years ago@yerbaMatte Well, that seems to be kinda tricky, as the image adapts to the set width (in this case 13fr) and the height depends on the given aspect ratio. But let's say you would achieve that, and the content of one article grows while the other two stay the same, you would end up with one larger image and unequal columns. The solution would only work, if the amount of content stayed the same.
0@yerbaMattePosted about 2 years ago@dusan-b yeah, okay so lets assume that i chose one of the highest content and now i want to apply this height to the rest of the pictures as well, how can I do that without passing a fixed height values?
0
Please log in to post a comment
Log in with GitHub
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord