diff options
author | Boris Kolpackov <boris@codesynthesis.com> | 2016-01-26 16:48:35 +0200 |
---|---|---|
committer | Boris Kolpackov <boris@codesynthesis.com> | 2016-01-26 16:48:35 +0200 |
commit | afa169cd0d5e7c5663bde829376b6248b9eba576 (patch) | |
tree | 4eba78150972e166207a9271414758d8999b646c /css-notes.txt |
Initial common and intro styles
Diffstat (limited to 'css-notes.txt')
-rw-r--r-- | css-notes.txt | 34 |
1 files changed, 34 insertions, 0 deletions
diff --git a/css-notes.txt b/css-notes.txt new file mode 100644 index 0000000..7680587 --- /dev/null +++ b/css-notes.txt @@ -0,0 +1,34 @@ +Some mobile device dimentions: + +Nexus 5 360 598 +Nexus 6 412 690 +iPhone 5 320 568 +iPhone 6 375 667 +iPhone 6+ 414 736 +Galaxy 5 360 640 +Galaxy 6 360 640 + +iPad 768 1024 +Galaxy 2,3 10" 800 1280 +Galaxy 2 7" 600 1024 + +Based on this, we define the following size brackets: + +320-359 small phone portrait +360-567 big phone portrate +568-1023 phone landscape, tablets portrate +1024- tablets landscape, monitor + +Body min-width: + +320px ~ 20em @ 16px font-size. This is factored in when doing font boosting. +Specifying 320px directly seems to mess it up. + +Font boosting results for font-size:1.1em (~18px), min-width:18em on Nexus 5: + + - about 40 characters in portrait + - about 70 characters in landscape + - landscape font appears slightly smaller + +18em on smaller phones (e.g., iPhone 4) appears to trigger scrolling. 17em +works well, however. |