Hopeful duplicate of Product Preview Card Component, HTML/CSS. Flexy

Solution retrospective
Most proud of the fact I was able to complete the project quickly after taken quite a break. Like I started work got a significant amount of progress completed (as my first commit to GitHub), and took quite a break, after coming back I zoomed through the rest.
What I would do differently next time is more closely look between my code after finishing and the preview as I've just noticed as of submitting that the current growth of the section is unlimited and far larger than that of the example.
What challenges did you encounter, and how did you overcome them?Getting the images to swap on differential sizing was a slight issue. Had been trying to get them to switch using picture/source and just wasn't switching on Width(px) breakpoint between laptop and mobile/tablet (750px). So, to fix said issue I just used in a media query above 750 to only show the desktop image class and only show the mobile class below 750.
Currently there is also 13px from 750px-763px that adds a little whitespace above and below the image, whitespace as the section space as the image does not seem to take all of the height at said width but works just fine outside of those width specifics. (750px-763px)
What specific areas of your project would you like help with?I'm not entirely sure where I would need help with. At the moment the only thing that seems to need adjusting is the sizing of the section when the width grows and shrinks and the left side "container" contents.
Please log in to post a comment
Log in with GitHubCommunity feedback
No feedback yet. Be the first to give feedback on TradesmanBOB's solution.
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