如何使布局垂直响应

Question

我正在创建一个网站页面，该页面对移动和桌面版本都有响应。

现在问题是，它在桌面以及http://mobiletest.me/

等网站上显示正确的布局

但是，当我在手机（特别是诺基亚Lumia的iPhone和互联网浏览器）中实际打开它时，它显示出奇怪的外观！没有风格，没有js什么都没有。

我想要达到什么目标？

我只想让桌子垂直和水平对齐在中心。无论它将在任何移动或桌面版本中打开。需要帮助！

Here is jsFiddle link

https://jsfiddle.net/milindtheachiever/4hsd85kf/

Answer 1

无论屏幕尺寸如何，要在屏幕中央对齐某些内容，请使用此选项：

position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);