I'm trying to use the viewport meta tag to scale HTML content when viewed on the Kindle Fire.
I have set up the following test page:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=2.5, maximum-scale=2.5, minimum-scale=2.5, width=device-width, user-scalable=no" />
</head>
<body>
<div style="width: 100px; height: 100px; background: red;">Hello World</div>
</body>
</html>
If I change the number from 2.5 to say 1.0 for example, this causes the content to be scaled down on the iPhone 4S. However, it appears to have no effect on the size of the content when viewed in the Amazon Silk browser on Kindle Fire.
Has anyone else experienced this? Is there a problem in my markup that could cause this?
Note: I have tried changing the 'Desktop or mobile view' browser setting to Automatic, Mobile and Desktop - none of these settings changed anything about the appearance of the page.
It is supported:
Test each property by itself to determine specific support for each option:
References
Amazon Silk Developer Guide: CSS3 Support - viewport meta element (pdf)
Screen Resolution - Amazon Silk
Dev.Opera — An Introduction to Meta Viewport and @viewport
CSS Device Adaptation Module Level 1: Properties
Evidence Versus Proof
The 4 Types of Evidence ~ Writing Simplified