user828591
user828591

Reputation: 1262

Scale mobile website with CSS Viewport

I want to change the look of a website on the mobile Opera browser. I use a user style to change some CSS values, this worked well for now, but the page doesn't scale to the devices full width (either orientation). Since I will only use this for Opera anyways, I can use the Opera-CSS property "@-o-viewport"

Here's a tutorial on how to use it: http://dev.opera.com/articles/view/an-introduction-to-meta-viewport-and-viewport/

The page has a fixed width, I still want the device to zoom into the website, so it's as big as possible while still showing the full width of the page.

When I'm trying this, it's not working. The page is shown with the different user style, but the css viewport property won't work the way I intended it to be, the page is shown at a zoom of about 0.4

Upvotes: 1

Views: 1552

Answers (2)

andreasbovens
andreasbovens

Reputation: 1437

@-o-viewport {width: $px}

where $ = the width of the page you're trying to optimize in pixels (e.g. 800)

Upvotes: 0

billythetalented
billythetalented

Reputation: 637

you could do it with the meta tag viewport:

<meta name="viewport" content="width=device-width, initial-scale=1">

Upvotes: 1

Related Questions