How to reach the requirement?
The requirement is: The element should responsively resize, relative to the width of its parent element, without exceeding its original size.
I do this but it doesn’t work, what’s wrong?
img {
max-width: 100%;
}
Link to the challenge:
Hi Kevin5,
Perhaps you can try to use what is explained in the lesson about responsive images at https://learn.freecodecamp.org/responsive-web-design/responsive-web-design-principles/make-an-image-responsive?
Do let us know if it worked!
sandrab
It works! Thanks!
I forgot to add display: block; so it didn’t responsively resize relative to the width of its parent element.
I’m experiencing similar issues but I’ve added the display: block; to it and still getting a error code.
I did it the way the video said to, and I’m still getting this error message:
// running tests Your responsive-img class should have a max-width set to 100% . // tests completed
That should be working. I remember that some users (for another challenges) reported that they couldn’t pass a test, and when they tryied with a different browser it worked. You could try with another browser.
Genius. Safari, Explorer and Firefox were having issues with this code. Chrome FTW. Thanks friend. Hope you’re safe during this pandemic.
You’re welcome. Hope you too.
Thanks for answering @napolimatiase
I have tried it and it works
So the solution works only in Crome, it does not work in Edge nor in Firefox.
That is so at least in my case, it would be good to report this peculiarity in the solution.
Thanks, guys. Was stuck on this using Edge. Doing it with Chrome did let me to submit my results.
@Karmann @alexanderangelov8 you are welcome!
thanks, I had had same problem
