@vahid2072
@CaseyLawver
Submitted
I have the desktop design basically done, (its still not quite centered) but I am struggling with the mobile design. I can't figure out how to make the image shorter in height and centering the main container div. Any feedback is greatly appreciated!
@vahid2072
Posted
Hi there, keep up the good work.
I'm no expert in frontend but you could use a div instead of img tag
<div class="image-container"></div> and use css background-image: url(); to add specified desktop or mobile image. In this case .image-container: background-image: url("images/image-product-desktop.jpg")Now you can change image on different size, by @media only screen and (max-width: 600px) { .image-container: background-image: url("images/image-product-mobile.jpg") }
you could give it width and height and style it as you need
I hope it'll be helpful, Goodluck.
@DhobaleAnjali
Submitted
Hello Everyone, Its my third challenge from frontend mentor, I have added reset styles and variables and utility classes this time, so this is some improvement from the last two challenges. But please feel to add some feedbacks. Thanks :)
@vahid2072
Posted
Keep up the good work
