Different Text Alignments on iOS Devices ...

This question is answered. Helpful answers available: 2. Correct answers available: 1.

Reply to this Thread

Search Forum

Back to Thread List

Replies: 5 - Pages: 1 - Last Post: 30 Jan 26, 15:57 Last Post By: JeffTucker

kilobravo

Posts: 179
Registered: 24-Feb-2010

Different Text Alignments on iOS Devices
Posted: 30 Jan 26, 13:17

	lifeboat.zip (823.4 KB)
	iphone.png (4.1 MB)
	ipad-mini.png (1.7 MB)

Just picked up an iPad Mini and noticed that the text below each image has a different alignment than the same image on an iPhone when viewed in portrait orientation. (see attached)

https://www.kilobravo.com/newer%20album/recent/index.html#img=rosetta_260128.jpg

I'm guessing that this is normal behavior on the part of the two iOS devices and just something to live with?

TIA

JeffTucker

Posts: 8,335
Registered: 31-Jan-2006

Re: Different Text Alignments on iOS Devices
Posted: 30 Jan 26, 13:36

in response to: kilobravo

Nothing to do with iOS. The skin developer has included some "@media" CSS, which changes the layout on smaller devices. The iPad Mini has enough resolution that it's not triggering the realignment - it's basically the same alignment you see on a desktop monitor. Try rotating the iPad to landscape mode, and I suspect you'll see what I mean. The caption is to the left, then the image counter, then the icon for displaying the photo data.

The phone is much smaller, so the layout gets changed- it centers the caption, with the image counter and photo data icon below.

ETA: The resolution of an iPad Mini is 1024x768, which is the same as an older laptop. So, it gets the "regular" layout.

kilobravo

Posts: 179
Registered: 24-Feb-2010

Re: Different Text Alignments on iOS Devices
Posted: 30 Jan 26, 14:47

in response to: JeffTucker

Thanks, Jeff and yes, I did test the pages in both portrait and landscape orientation and I saw that in landscape as you mentioned, the layout is the same as on a desktop display.

Roger on the iPad Mini having just enough more screen real estate that it doesn't meet the criteria and there's the rub I guess. NBD. And FTR, the 7th gen iPad Mini's screen dimensions are 2266 x 1488.

As always, thanks for the prompt and helpful reply, mi amigo,

KB

JeffTucker

Posts: 8,335
Registered: 31-Jan-2006

Re: Different Text Alignments on iOS Devices
Posted: 30 Jan 26, 14:53

in response to: kilobravo

kilobravo wrote:
And FTR, the 7th gen iPad Mini's screen dimensions are 2266 x 1488.

It's a double-density display, so that's physical pixels, not CSS pixels. As far as CSS is concerned, it's a 1133x744 display.

In my skins, I usually do the "layout shift" if the device's logical pixel count (CSS) is less than 500 pixels in either dimension, which tells me that it's a phone. Anything bigger is a tablet, and those get treated just like a laptop or desktop.

kilobravo

Posts: 179
Registered: 24-Feb-2010

Re: Different Text Alignments on iOS Devices
Posted: 30 Jan 26, 15:46

in response to: JeffTucker

Copy all on pixel count and as for your logic regarding when to have the display shift seems sound to me and should cover all eventualities, at least for JAN 2026. It would be nice if there was a standard then everyone would know what to expect during design.

Thanks again, Jeff.

JeffTucker

Posts: 8,335
Registered: 31-Jan-2006

Re: Different Text Alignments on iOS Devices
Posted: 30 Jan 26, 15:57

in response to: kilobravo

Even within the same IT "family" there's no standardization. Laza and I use different breakpoints for different things.

Pages: 1

Back to Thread List

Legend
	Forum admins
	Helpful Answer
	Correct Answer