调整网页以适应iPhone屏幕

Question

我已经通过this教程创建了一个css家族树。在桌面浏览器中，它看起来很完美。 Here是它的外观。

现在我试图让它在iPhone和iPad屏幕上显示相同。但在这些屏幕中查看时，会混淆布局。像这样。

注意一些连接节点的线的缺失。

我试图使用html元标记调整页面的大小。试了下面的所有3行。

<meta name="viewport" content="width=device-width"> 

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

<meta name="viewport" content="initial-scale=2.3, user-scalable=no"> 

但无济于事。我只需要缩小页面以适应iPhone和iPad屏幕。任何人都可以告诉我我该如何做到这一点？

我在这里也创建了fiddle来演示这个问题。

谢谢。

Answer 1

你问错了类别:)这是更多的CSS然后其他任何东西。

我敢打赌你现在找到了答案。 但对于你的小提琴：

.tree { 
      width:1100px; 
    } 

只要让我知道，如果你需要什么了。 祝您有愉快的一天。