2012-07-12 60 views
1

我開發一個移動網站,並試圖用非常簡單的標記。檯面高度不工作

下面是我的代碼,這是給我的問題:

<div class="abc"> 
    <div>&nbsp;</div> 
    <table> 

    </table> 
</div> 

CSS

.abc {height:some-dynamic-value-in-px} 

.abc div {height:5%;} 
.abc table {height:95%;} 

問題是這樣的代碼,所有的最新phones.But工作時,我對索尼埃裏克鬆選中(500I) 表格高度是從父div abc出來的,UI被扭曲了。 我檢查這個網站http://www.apptools.com/examples/tableheight.php 並給予了高度{100%}到身體,但仍然沒有成功。 請讓我知道我要去哪裏錯了。

此外,當我在PX給這個高度對全體handsets.But我想知道爲什麼比例不工作的原因。

+0

你可能在微妙的細節燃燒大量時間撥號上的移動平臺看似無盡的陣列。我建議使用[JQuery Mobile](http://jquerymobile.com/)設計器之類的東西爲您生成適合移動設備的HTML佈局。他們已經經歷了讓佈局在所有流行的移動平臺上看起來正確的痛苦。 – Asaph 2012-07-12 05:22:30

+0

是的我知道Jquery Mobile,但由於某些原因,我們不允許使用JS,所以我需要完全依賴HTML和CSS。 – user1483487 2012-07-12 05:24:15

回答

0

如果你已經知道div的高度,那麼它最好使用固定尺寸px

儘量避免複雜,如果沒有必要的。

而對於某些瀏覽器,讓body { height: 100%; }可能還不夠。

html, body { height: 100%; } 

.abc { height:100%; } 
.abc div { height:5%; } 
.abc table { height:95%; } 

另外,不要忘記加入您的網頁的DOCTYPE

+0

我正在使用百分比,以便佈局在所有瀏覽器/瀏覽器上都呈現幾乎相同的效果。我也包括DOCTYPE。我想用px工作是最佳解決方案。 – user1483487 2012-07-12 05:49:42

+0

@ user1483487,如果真的那麼重要,使用腳本來控制尺寸。 – Starx 2012-07-12 05:59:03