Image rendition on mobile

pideja · 2019-12-12 21:57:11

why do images on these sites look bigger on the iPhone:
https://pideja.ca/tnm/galleries/saison- … single.php orhttps://pideja.ca/duc/galleries/2018-20 … single.php
than these same images here:
https://pideja.ca/galleries/03-tnm/sais … single.php or https://pideja.ca/galleries/01-duceppe/ … single.php.

I compared the settings in Backlight and in the CSS and I can't find what is controlling the size of these images on the mobile.
Regrettably, I don't have a tablet so I don't know if the same phenomenon applies, but I would think it is. The display on the large screen (workstation) is OK.

rod barbee · 2019-12-13 00:34:42

it looks to be something in your custom css. In the inspector I deleted your css and the image size increased

probably something in a media query since it only affects small screens

rod barbee · 2019-12-13 00:44:47

looks like it's this padding setting, starting on line 227 of your custom css:

.the__copy {
		font-size: 1rem;
		line-height: 1.5rem;
		padding: 20px;
	}

pideja · 2019-12-13 03:27:05

I "commented out" the padding setting and..nothing changed on the iPhone nor the desktop.

rod barbee · 2019-12-13 04:17:50

try changing it to padding: 0;

but that will also affect copy padding for any other pages.
If it does, you can use one of the body classes to limit it to just albums. but that will still affect text in albums.

It looks like in the single image html pages, the images are placed in the page__copy div.

anyway, that padding you've added is why the images are being made smaller. The albums you link to where the images are larger don't have that rule in your custom css

Community @ The Turning Gate

#1 2019-12-12 21:57:11

Image rendition on mobile

#2 2019-12-13 00:34:42

Re: Image rendition on mobile

#3 2019-12-13 00:44:47

Re: Image rendition on mobile

#4 2019-12-13 03:27:05

Re: Image rendition on mobile

#5 2019-12-13 04:17:50

Re: Image rendition on mobile

Board footer