如何为移动设备和桌面设置宽度？

Question

现在，我的DIV的宽度是100％。这在移动设备上很棒。它伸展，并不需要用户向左或向右滚动。它只是“合适”。

但是，在一个大显示器上...... DIV被拉长了，所有float：left的东西都在左边，而所有的float：right都在右边！

我想要一个这样的风格解决方案。我可以在此div中添加哪些属性，以便人们在桌面上查看它时，它最大可以达到500像素（并且仍然保持移动设备的弹性）？

顺便说一下，我想为移动+桌面使用相同的模板。 （让事情变得简单）

谢谢。

Answer 1

使用下面的CSS：

max-width: 500px; 

正如在对方的回答说，这是不是在早期版本的Internet Explorer（< = 6支持如果我是正确的），但它适用于大多数移动浏览器，因为它们大多数（iPhone，Android，Palm Pre）使用WebKit引擎，而Opera Mini和Mobile也支持它。

Answer 2

您正在寻找max-width：

<div style="width: 100%; max-width: 500px"> 

应该做的工作。

它不起作用IE= 6，但我不知道移动浏览器支持 - 一定要测试。 Quirksmode compatibility table

更新：Opera Mini的和Safari移动definitely support it.