Screen size tests
This test has <meta name="viewport" content="width=device-width"> tag.
This is a paragraph that is supposed to take the entire width (whatever that may be) of the browser canvas and even wrap to the next line. Obviously, since no width has been defined on anything, the browser must have some clever way of handling this paragraph, or it’ll be unreadable. Right now I feel that the different between browser experiences will mainly depend on handling this issue.
And this span is supposed to span 50% of the paragraph.- No viewport set
- With viewport width set to device width, intial-scale=1.0
- With viewport width set to device width, intial-scale=1.0, div width = 1600
- With viewport width set to device width, intial-scale=1.0, div width = 1600 height = 1600
- With viewport width set to device width, div width = 1600
- With viewport width set to device width, div width = 1600
- With viewport width set to device width, div width = 1600 height = 1600
- With viewport intial-scale = 1.0
- With viewport intial-scale = 1.0, div width = 1600
- With viewport intial-scale=1.0, div width = 1600 height = 1600
No Viewport
Device Width and Intial-scale=1.0
Device Width
Initial-Scale
This div has a width of 1600 px
This div has a height of 1600 px