Skip to content

Product preview after feedback#5

Open
wotanut wants to merge 2 commits intomainfrom
product-preview
Open

Product preview after feedback#5
wotanut wants to merge 2 commits intomainfrom
product-preview

Conversation

@wotanut
Copy link
Copy Markdown
Owner

@wotanut wotanut commented Oct 11, 2024

Hey Sam!

Good job buddy, the only thing here (for now) is that your design gets destorted for Mobile, and this is due to the fact that the img here will be smaller than the other content below it because you gave the img a width 50vw which is not matching with the other elements in the design, to avoid this and to make the life easier when you deal with images do not NEVER EVER put them alone like this in your design, images are displayed as inline by default and they have something called aspect ratio which makes it really hard to align them and play with their dimensions, so you always wrap any image you like inside a div, then you specify all the dimensions you want of that div, then you only give the img one attribute (max-width: 100%) and here you go now you can align it with grid you can do whatever you like with it.

You can change the display of the image to be block and give it a max-width: 100%, but I still won't recommend that.

Keep it up!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant