Image styling in oik.css breaks background images in Google web story

[bobbingwide]

A colleague suggested I try using Google web story plugin on a new website. When I tried to add a background image to a page the image did not cover the whole of the background in the editor. It was OK in the front end. I noticed that the display was also broken in the Stories dashboard.

Problem determination

Having failed to find where the background image was styled using the inspector we looked at the activated plugins. Deactivating oik resolved the problem. Next I reactivated oik but checked the box to not enqueue oik.css. This also resolved the problem. So then I re-enabled the enqueueing of oik.css and changed the CSS file in the inspector until the problem went away. It didn’t take lone. I simply removed

img { max-width: 100% }

Problem resolution

• There are a couple of workarounds identified above
• But it you want oik.css for other CSS then we have to find another solution.
• The problem doesn’t occur in the front-end, so perhaps we don’t need to enqueue oik.css when on the Story page

OR can we simply remove the image styling?
This is where I need help. Is this the right approach? Should the web story plugin be catering for the problem?

[bobbingwide]

delivered in oik v4.1.0. need to write a release note. if CSS still needed use custom CSS.