-
Posts
-
First… amazing theme, brilliant.
I’m using the WP Retina 2x plugin to serve retina images when appropriate. It’s been working fine, until I updated to the latest version of Enfold, now any new images I attach, when the browser loads the retina versions, the display size doubles. Fortunately, the images I’d built on pages prior to updating Enfold are unharmed.
To insert an image, I’ll use the image component in the Avia Layout Builder, click to add/edit the image, click to upload an image, then I’ll upload both the normal and the @2x versions. I select the normal size as the one to attach, save and publish.
It displays fine on non-retina displays, but on retina displays, once the retina images load, they appear twice as large, instead of the same size, just sharper.
For an example of it working, see my home page: http://goo.gl/klxWmw
To see how it blows up, see this page: http://goo.gl/ZrdJerAny help would be greatly appreciated.
Hi Rusty!
Can you please post a screenshot of the issue? I’ll ask Kriesi and Devin to check it. Meanwhile, please try to add this on your custom.css or Quick CSS:
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { img, a img { max-width: 100%; } }Nice website. :)
Regards,
IsmaelI’ve been through all 7 pages of support on the wp plugin support page for wp Retina 2x and tried the various things that “fixed” the issue for others who were having it. They included changing the .js file in the plugin, attempting custom css, etc. None of them work. According to the author of the plugin, it’s got to be a CSS issue where the theme is using CSS that breaks it.
To be clear, the specific time it breaks is when I am building a custom page using the page-builder, and I insert an image, simultaneously uploading an @2x equivalent for retina displays. The @2x image displays, but at double the size.
I really appreciate whatever help you can provide. It’s very strange, because at one point all the images on the custom pages were working fine on retina, then when I updated the theme, they stopped working. I’ve tried disabling all my plugins (except wp retina 2x), and that doesn’t fix it.
Again, thank you. Amazing work.
I’m really frustrated by this issue.
Here’s what I’ve found, after countless hours… When the retina images load, they are expanding to 100% the width of their container. When in non-retina, the image retains its intended size.
The only fix I can find, is to manually set the height of every single image I place on my site in the quick css, as follows:
#about-ces .avia-image-container img{
height: 337px !important;
}When I look at it under Chrome’s css inspector, the offending code seems to be that base.css is setting “height:auto”, and when I turn that segment off in the inspector, the images all shrink down to their appropriate size. The code inspector lists the setting in:
media=”screen”
img, a img {
border: none;
padding: 0;
margin: 0;
display: inline block:
max-width: 100%;
height: auto;
image rendering: optimizeQuality;
}And when I turn off the “height: auto” setting, it works.
Can Devin, Kriesi, or someone help me find a global fix to this please? Thanks.
Hi,
I’m having the same kind of issue. Using WP Retina 2x, and images within a post double in size when @2x image is loaded. Logo and other images are fine. The post images have height and width defined. I tried both the suggestions in this comment (and cleared cache just to be sure) and neither seem to work. Turning off height: auto on base.css made the vertical height fine, but the width still doubled. You can see an example here (with neither suggestions added) http://goo.gl/de3fyhThanks.
Hey!
@Bernewton: Is it possible for you to post a screenshot? Please try this on Quick CSS:@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and ( min--moz-device-pixel-ratio: 2), only screen and ( -o-min-device-pixel-ratio: 2/1), only screen and ( min-device-pixel-ratio: 2), only screen and ( min-resolution: 192dpi), only screen and ( min-resolution: 2dppx) { img, a img { max-width: 100%; } }Cheers!
Ismael
- You must be logged in to reply to this topic.