Tablet comparison

This comparison of 7'' tablets is ancillary documentation for the ALA article Vexing Viewports. It compares the factual CSS pixel density and em-width of these tablets.

The em-width is the most important bit of data. It tells you how many characters fit on the screen by default. (OK, it’s more complicated than that, but this definition will serve for now.)

The iPad Mini’s em-width is far too high; 48 instead of the 36-37 that the other tablets use. Thus fonts are distinctly smaller on an iPad Mini than on comparable tablets.

In order to get the iPad Mini in line with the rest, it would have to have a device-width of about 600px or a default font size of about 20px.

The first generation Samsung Galaxy 7'' had a too low em-width, resulting in huge text, but that was corrected in the second generation. Apple should do the same.

Tablet dimension device-width px/inch Font size em-width
Nexus 7 3.75 603 ~ 160 16px 37.7
Kindle Fire 3.5 600 ~ 170 16.6px 36.1
iPad Mini 4.75 768 ~ 160 16px 48
PlayBook 3.54 600 ~ 170 16px 37.5
Galaxy 7'' (1st gen) 3.5 400 ~ 115 16.6px 24.1
Galaxy 7'' (2nd gen) 3.31 600 ~ 180 16px 37.5
dimension
Physical width in inches of the screen in portrait mode, excluding the bevel
device-width
Width of layout viewport in pixels after applying <meta name="viewport" content="width=device-width">
px/inch
CSS pixels per physical inch; this equals device-width divided by dimension
Font size
Default font size; get it here
em-width
Number of ems fitting on screen; this equals device-width divided by font size