How do I make my images mobile responsive?

I have created a rough image blog page. It shows all images centred, rolling one after the other.

https://cncours.com/pages/parc-ferme-1

However in Mobile it stays small. I would like it to be small on desktop, but full bleed on Mobile.

How can I do this? Currently I am using this code on the page’s custom css for desktop:

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 35%;
}

Use this css to make image full-width on mobile

@media screen and (max-width: 768px) {
.center { 
    width: 100%;
}
}

Thanks

1 Like

Amazing. Thank you!