
Design comparison
Solution retrospective
I am happy I was able to make the text of the webpage responsive without using media queries. It was an opportunity for me to learn something new.
What challenges did you encounter, and how did you overcome them?Make the svg image fit its container
I change the default display value from inline to block.
Make text responsive without media queries
I used the clamp() function.
What specific areas of your project would you like help with?I would like to know if apart from the clamp() function, there is another way to make the text of a webpage responsive without media queries.
Community feedback
- @KuvashneeNaidooPosted 1 day ago
Hi @MartheAudrey
Great work completing this blog preview card! You have done well capturing the layout ⭐👏⭐
To answer your question: You can make this card component responsive without using clamp() or media queries by utilizing Bootstrap's grid system and flexbox utilities. This is just something that you could consider exploring.
For instance, you can use the card component in Bootstrap, which automatically adjusts its content based on the screen size. You can also use classes like card-title, card-text, and text-center to manage text layout and responsiveness. This approach eliminates the need for custom font scaling or media queries.
You can learn more about using the Bootstrap card component here: Bootstrap Card
Otherwise nice work completing this solution! 🚀🚀🚀
Happy coding :)
0
Please log in to post a comment
Log in with GitHubJoin 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