A lot of challenges with media query since it was the first time using it. ex. font size not changing when reaching a different width and height in query and staying the same as it was before. Googling helped
Latest solutions
Recipe Page
Submitted 6 months agoI would like help with the screen sizes. When shrinking the screen my image goes away.
Latest comments
- @1lijaSubmitted 6 months agoWhat challenges did you encounter, and how did you overcome them?@gozicaPosted 6 months ago
The solution includes semantic HTML and is mostly accessible. The layout is responsive, the code is well-structured and reusable, and it closely matches the original design.
0 - @Sam02marquesSubmitted 7 months ago@gozicaPosted 6 months ago
The layout on different screen sizes is were I am having a bit of trouble with and would like some input/help from the community. Other then that the challenge was really fun and can't wait to keep going with the learning path.
0 - P@marcus-hillSubmitted 6 months agoWhat are you most proud of, and what would you do differently next time?
The overall design and the use of figma in order to perfectly calculate the sizes for padding, divs and margins. I also used media queries to make it responsive for tablets, desktops and mobiles (as per the figma design files).
What challenges did you encounter, and how did you overcome them?I encountered problems initially trying to make it responsive for mobile and desktop without the use of media queries. However, once I added media queries I was able to use the Chrome Developer tools to assist me in resizing them with the use of rems.
What specific areas of your project would you like help with?I would like help with my use of media queries. I am not sure if this is the best way to do it in order to follow best practices of responsive websites and whether pixels are the best units to do this.
@gozicaPosted 6 months agoThe solution includes semantic HTML and is mostly accessible, though I could enhance it with better color contrast and alt text. The layout is responsive, the code is well-structured and reusable, and it closely matches the original design.
0 - @AndresLamarSubmitted 6 months ago@gozicaPosted 6 months ago
The solution includes semantic HTML and is mostly accessible, though I could enhance it with alt text for the imgs. The layout is responsive, the code is well-structured and reusable, and it closely matches the original design.
0 - P@GMarqzSubmitted 6 months ago@gozicaPosted 6 months ago
This solution includes semantic HTML, though I could improve accessibility with better color contrast, alt text, and a clearer heading structure. The layout looks good across screen sizes, but I can further refine centering the div using flexbox or grid for easier alignment.
Marked as helpful0