Why is the viewport tag changed in Foundation 5.0? No width=device-width?

Question

In Zurb Foundation 4.0, the docs say to include (in a page head):

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

In Zurb Foundation 5.0, the docs say to use:

<meta name="viewport" content="initial-scale=1.0" />

Notice that the "width=device-width" specification was dropped. Why?

Every responsive design framework that I've seen includes the "width=device-width" specification. What does it do and why did Foundation 5.0 drop it?

Answer 1

It got removed due to an internal miscommunication. Having width=device-width alone causes zooming on some devices when you switch to landscape mode, something that's fixed by adding initial-scale=1.0. Only having initial-scale=1.0, however, breaks the viewport on Android.

The downloads should have the correct viewport tag (<meta name="viewport" content="width=device-width, initial-scale=1.0" />) in the sample index.html, and the docs should be fixed now, but let us know if you find an error.

Answer 2

I dont know why it is dropped in foundation 5 , may be it is a bug!

It sets the browser’s layout viewport, relative to which CSS declarations such as width: 20% are calculated, to the device width.

(Incidentally, Opera has proposed to port this functionality to full CSS, which all in all seems to be a good idea. But for the moment we’re stuck with the HTML tag.)

Normally the layout viewport takes a width that the vendor has decided is optimal for viewing desktop sites. By setting the meta viewport to device-width you’re sure that your site’s width is optimised for the device it’s being viewed on.

You can do this also using media queries..

You can read clearly here http://tech.bluesmoon.info/2011/01/device-width-and-how-not-to-hate-your.html