在宽度较小的不同设备上正确使用移动视口

我有移动设备的css代码:

@media all and (min-width: 0px) and (max-width: 991px) {...}

我有这样的HTML:

主要的问题是,当我第一次打开我的网站时:在大多数设备上,我必须扩展我的浏览器视图以适应它...

可以自动安装设备吗？例如,如果设备宽度为340:我应该将其缩小一点(因为网站大到340px(它; s min.640px))...如果900:那么缩放...

甚至是ipad(在纵向模式下,因为它的宽度是768px).

有可能吗？

plunker:

https://plnkr.co/edit/5KhIlmtLkWhtROs7y188?p=preview

和演示:

为什么我有滚动条？我需要以某种方式将其缩小,以便我不会在那里有任何滚动条......我的容器应该是640px而没有移动设备的其他值...