The answer has been to contact the theme provider to ask them to add CSS that would work with the picture tag.
My question is:
Can you be more specific about which CSS rules you’re referring to? From my reading, all CSS goes on the img tag, which is already there, and the picturetag should be rendering the img and its styles. However, using your explanation of adding a “CSS rule to apply on <picture> tag elements” I can’t seem to find any resources on this when googling the subject.
Let’s say we have the typical WP “alignleft” class. What does our CSS file need to display it properly, when the class has been applied to the picture tag now, instead of the img tag? How do we get text to wrap around the Webp image in this context with added CSS?
See this example: https://cloudup.com/ciW0wmPEqPA – it should look like this: https://cloudup.com/c4WEOjb5GLI
Also, on our site, one of the images changed it size and scaled down when it should not have. Can you tell me if this is fixable?
Compare this: https://cloudup.com/cZ5d-X1YLRA with this: https://cloudup.com/c68rvkCwCA5
I am using a Genesis theme, if that gives any context.
I am comfortable with CSS, but when googling this, I’m stumped (at least so far).
Also, for paid users, is this something you help with as a support request?
Thank you very much for putting time into this plugin. It seems promising. Just hope to work out these kinks before rolling it out side-wide.
]]>— JS CODE —
<script type='text/javascript'>
window.addEventListener("load", doStuff, false);
window.addEventListener("resize", delay, false);
var id;
function delay(){
clearTimeout(id);
id = setTimeout(doStuff, 200);
}
function doStuff() {
el = document.querySelectorAll('img.pic');
for (i = 0; i < el.length; i++) { console.log(el[i])
el[i].removeAttribute("style");
el[i].setAttribute("style", "height:100%; width:100%; object-fit:scale-down;");
}
}
</script>Thanks for the plugin.
I have people with 20mp+ cameras unable to upload 4 images (Sony Xperia for example). Is there a way to reduce the size?
Thank you very much
]]>Im not sure if its variant on the theme or if its part of WP
Blog is www.audiblechem.com . As you can see many of our images on our posts are cropped from their original size on both the thumbnail and the image at the top of the posts themselves.
Odd thing is that for images that are super massive (for instance one thats roughly 3000 pixels x 2000 pixels) the images seem to be fine and scaled nicely without cropping, but when I use one that’s maybe 500×500 it’s all cropped down to whatever was in the center of the picture without any scaling.
]]>