RTE images max-width 100%

[NathanPJF]

How does everyone feel about adding the following to the rich text editor module?

.rte{
  img {
    max-width: 100%;
  }
}

I just did this for a shop using timber because on mobile its images were still using the 1024x1024 versions and being pushed outside the container.

[cshold]

Big oversight not having that in there already. I think we assumed that rte containers would be inside a grid__item, but that definitely isn't always the case. Do you want to add a PR and either add it here (https://github.com/Shopify/Timber/blob/master/assets/timber.scss.liquid#L1326) or in the RTE section?

[NathanPJF]

If I add it to the "#Images and Iframes" section, should I just replace img.auto with img? Is there a case where you'd need the same declaration for both selectors?

Having img.auto gives you some added specificity, so maybe it's useful to have when you need to chain some classes together?

[cshold]

Yea, you can replace that. It seemed like a good idea at the time but is not used enough to be in base Timber.