What I have learned:
I learned Resolution Switching: A given Image in a mobile First Approach switches to another source on another resolution.
My questions to the community:
Is the semantic HTML I have used correct?
There is still a DIV in my Code. What can I use instead of this DIV in the context of semantic HTML?
I have used only Flexbox. Is Grid a better approach? And how should I have used it?
I am very happy about any advice!
Best regards Thomas
Firstly, congrats on your stunning solution. The only advice that I would give is that you must have a <main> tag on any page you make, I heard a couple of geeks saying that for screen readers and accessibility reasons.
Waiting for feedback :)
Why there are different heights of flex items (img and content) between 550px screen-width-630px screen-width?
Firstly, congrats for your solution you really did a great job. I recommend that you put the background color to the body element not to the products section, and also make the body as a flexbox. like: ''' body{ background-color: whatever; display: flex; flex-direction: column; justify-content: center; align-items: center height: 100vh; } '''
Tell me your opinion , help me to improve my skills.
It actually looks great you did a really good job!!! My advice is to stick to the style guide file (according to the font and color properties), and solve the HTML issues reported (like the title and the favicon). And if you get stuck somewhere -as all we have been through- after finishing your trial try to look up solutions on youtube so you can actually get better and try to learn from them not just to copy them.
