Responsive Advice Generator App with API

Solution retrospective
- I found it difficult to integrate the API.
- Still have to learn about async and await.
- I am unsure of the javascript code for "JSON", "fetch" and "then" as I had to take help from the internet.
- How can I improve my css responsiveness?
Please log in to post a comment
Log in with GitHubCommunity feedback
- @Tryt4n
Firstly for your whole element you gave
max-width: 25vw
that's mean if you have mobile with width of for example 400px the element width would be 100px. You could do something like this:min-width: 25vw;
max-width: 500px;
That's mean width would be 25vw but no more than 500px. Of course you can change those values.
Another thing add to your
img
linemargin-inline: auto;
because it's not centered. That's mean add the same amount of margin in the left and the right.Last thing add
text-align: center;
to your whole element so the text content would be centered.Marked as helpful
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