IE與火狐對百分比寬度解析的細小差異

2021-06-19 16:07:33 字數 551 閱讀 4020

ie與firefox對百分比寬度解析存在細小差異,假設乙個div寬度800px。裡面有8個字div等寬依次浮動,可以這麼寫。

以下為引用的內容:

.out

.out .in

html**:

以下為引用的內容:

照我們的理解:12.5% * 8正好為100%嘛!所以內部8個div的寬度一起浮動總寬度應該正好等於外部div的寬度的。

ok,想法畢竟是想法,而事實上:火狐下是這樣子,但是ie,不好意思,不是這樣的。

這裡我沒有計算,資料或許有不准,但是原理是實踐過滴。

ie算百分比的時候完全取整的。

777px*12.5%=97.125

ie會取整,於是為97px,8個累加就是776px,結果總長少了1px。

同樣的,如果外部div寬度為772,則

772 * 12.5%=96.5px,取97px,結果776px,總長長了4px。

這是我在寫自適應頁面時遇到的乙個比較頭疼的問題。問題原因是知道了,如何解決還沒有想到很好的方法。

firefox下表現很好。ie,嘆息!

IE對百分比寬度的理解。。。貌似很囧

布局的時候貌似發現ie對百分比的寬度計算有點問題,google之。果然。寫道ie與firefox對百分比寬度解析存在細小差異,假設乙個div寬度800px。裡面有8個字div等寬依次浮動,可以這麼寫。以下為引用的內容 out out in html 以下為引用的內容 照我們的理解 12.5 8正好為...

寬度百分比單位的轉換公式

目標寬度 上下文寬度 結果 比例寬度 當前元素的畫素寬度 當前元素的父元素的畫素寬度 當前元素的百分比寬度 例如 原css wrapper header aside section wrapper header aside section 百分比寬度css wrapper 指定外圍寬度,數值隨意 h...

百分比與聖杯布局

最近在開發乙個簡單的頁面的時候,需要給頁面去做乙個布局,具體部分就是頭部header和內容區域。這裡有乙個要求就是頭部定好寬度以後,需要讓container占有整個螢幕,那最好的辦法就是直接計算頁面的高度,然後減去header的高度,即可得到container的高度。可是,這樣需要js去計算瀏覽器寬...