html - 使div内容具有响应性

我的内容目前没有响应。我已经在iPhone上对其进行了测试，并且文本显示在屏幕上。

我已将容器的CSS更改为:

#container2 {
    width: 960px;
    max-width: 90%;
    position: relative;
    left: 50%;
    margin-left: -480px;
    line-height: 1.4em;
}

当我在更改后对其进行测试时，内容消失了。我读到把max-width:90％;将允许它不超过边界宽度(http://webdesignerwall.com/tutorials/5-useful-css-tricks-for-responsive-design)，但显然它没有用。我究竟做错了什么？

最佳答案

试试这个CSS:

/* Show in default resolution screen*/
#container2 {
width: 960px;
position: relative;
margin:0 auto;
line-height: 1.4em;
}

/* If in mobile screen with maximum width 479px. The iPhone screen resolution is 320x480 px (except iPhone4, 640x960) */
@media only screen and (max-width: 479px){
    #container2 { width: 90%; }
}

这里的演示:http://jsfiddle.net/ongisnade/CG9WN/

关于html - 使div内容具有响应性，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/12632500/