2012-02-08 58 views
2

我有一個div包含一堆其他divfloat: left如何在放大時使CSS在桌面上像在桌面上一樣浮動迴流?

在桌面的Firefox中,當我改變窗口大小或當我縮小頁面(Ctrl +/-)時,塊將會很好地重新焊接。

但是,當我在Android上縮小同一頁面時,內容將不會重排,並且其中一些內容將在視圖外部結束,需要滾動才能看到它。

我該如何讓移動瀏覽器迴流桌面上的塊?

<html> 
<head> 
<style type="text/css"> 
#box { } 
#item { float: left; } 
</style> 
</head> 
<body> 
<div id="box"> 
    <div id="item">A</div><div id="item">B</div><div id="item">C</div><div id="item">D</div><div id="item">E</div> 
    <div id="item">A</div><div id="item">B</div><div id="item">C</div><div id="item">D</div><div id="item">E</div> 
    <div id="item">A</div><div id="item">B</div><div id="item">C</div><div id="item">D</div><div id="item">E</div> 
    <div id="item">A</div><div id="item">B</div><div id="item">C</div><div id="item">D</div><div id="item">E</div> 
    <div id="item">A</div><div id="item">B</div><div id="item">C</div><div id="item">D</div><div id="item">E</div> 
    <div id="item">A</div><div id="item">B</div><div id="item">C</div><div id="item">D</div><div id="item">E</div> 
    <div id="item">A</div><div id="item">B</div><div id="item">C</div><div id="item">D</div><div id="item">E</div> 
    <div id="item">A</div><div id="item">B</div><div id="item">C</div><div id="item">D</div><div id="item">E</div> 
    <div id="item">A</div><div id="item">B</div><div id="item">C</div><div id="item">D</div><div id="item">E</div> 
    <div id="item">A</div><div id="item">B</div><div id="item">C</div><div id="item">D</div><div id="item">E</div> 
    <div id="item">A</div><div id="item">B</div><div id="item">C</div><div id="item">D</div><div id="item">E</div> 
</div> 
</body> 
</html> 

回答

0

不幸的是,這是Android上已知的錯誤。 你應該已經能夠去解決這個問題,簡單的JavaScript:

function recalculate(){ 
    var el = document.getElementById('box').style; 
    el.width = document.body.offsetWidth+"px"; 
    return true; 
} 

<body onresize="recalculate();"> 

但隨着Android的問題是,即使在變焦內部寬度值/後的文件的高度不會改變。 http://code.google.com/p/android/issues/detail?id=10775

但也許你可以找到不同的解決方案,你的問題與媒體查詢和視口元標記?