Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Does anybody know why iPhone 6 renders width: 50% differently? Reply To: Does anybody know why iPhone 6 renders width: 50% differently?

#210604
Senff
Participant

My guess is that is has to do with the fact that the iPhone 6 screen’s width is an odd number (375, at least in the Chrome emulator), so half-pixels come into account and that always gives unexpected results; also, consider the fact that you can’t fully emulate a retina screen (where 1 pixel is actually 2 pixels).

Each column ends up being 182.5 pixels wide (half of the wrapper, which is 365), which (probably) translates into 183 actual pixels because it rounds up. Having two columns of 183 doesn’t fit into the available space of 365 pixels of the wrapper, so it wraps.

For the iPhone 5, the screen is 320 wide. The wrapper ends up being 310, and each column is 155. No dealing with half-pixels, rounding off, etc.

Not sure if this is also the same behavior on an actual iPhone 6 though!