响应式设计，设备高度

我正在为所有设备（尺寸）制作响应式应用程序，我使用公式，目标/上下文=结果。对于宽度我给93.75％（900/960），当我用高度相同的公式 - 62.5％它不可见，如果我使用600px的高度，maincontent div是可见的，如何解决这个问题？响应式设计，设备高度

下面是我的代码我试过了，

<div class="maincontent"></div> 

.maincontent{ 
width:93.75%;/*900/960*/ 
margin:5% 3.125%; /*30/960*/ 
height:62.5%;/*600*/ 
background:#2c3e50; 
}

来源

2013-10-18 Raazsandee

我不知道你想做什么，但你这样做错误。你需要什么样的网页看起来像？在什么高度需要修改页面？ –

我想做出反应，宽度和高度并不重要，它应该适应所有尺寸。。。例如ex 1280 * 800,800 * 1280,1024 * 600,720 * 1280,540 * 960,600 * 900,320 * 480等。。。查看我的应用程序链接 - http://dgcalc.comli.com/ – Raazsandee

我想你把更多的工作这个比你需要，这里的我会怎样设置你的计算器：

http://jsfiddle.net/TTQ4e/1/

使用百分比可以很快得到混乱 - 请注意我使用的唯一百分比是100％。

你可以做这样的事情

.myDiv { 
    display:none; 
} 

@media (max-height:600px) { 
    .myDiv { 
     display:block; 
    } 
}

编辑

也做出了一定的高度后，一个div可见，唯一的手持设备的分辨率，你应该真正担心的是这些：

320x480

480x320

为360x640

640×360

768×1024

1024×768

800x1280

1280×800

来源

2013-10-18 06:22:06

实际上，您甚至不需要使用100％。 'block'元素具有100％的隐含“宽度”。至于'身高：100％'，我想不出任何情况，当你不想让内容决定高度时，尤其是在响应式设计中。我永远不会理解为什么人们会认为响应式设计=全部使用百分比。 –

响应式设计，设备高度

回答

相关问题