火狐表格錯亂兼容性問題

對于某一單元行需要顯示時,使用CSS display:block屬性,不需要顯示時使用display:none屬性,在IE瀏覽器中顯示正常,沒有任何問題,但是當用Firefox瀏覽時卻出現了布局錯亂的問題,這是為什么呢?

本文向大家介紹一下如何解決CSS display:block在Firefox下顯示布局錯亂問題,按照常理,對于某一單元行需要顯示時,使用CSS display:block屬性,在IE瀏覽器中顯示正常,但是當用Firefox瀏覽時卻出現了布局錯亂的問題,這里和大家分享一下解決方法。

CSS display:block在Firefox下顯示布局錯亂問題
按照常理,對于某一單元行需要顯示時,使用CSS display:block屬性,不需要顯示時使用display:none屬性,而且這樣做在IE瀏覽器中顯示正常,沒有任何問題。
但是當用Firefox瀏覽時卻出現了布局錯亂的問題,然后通FireBug去看了下源碼,調試下了,發現是CSS display:block屬性搞的鬼。
1、當表格為多列的情況下,屬性為"CSS display:block"行的內容寬度僅與第一列寬度相同,也就是說無論你使colspan的屬性值為多少,剩余列的空間都不進行解析。
2、同一行反復的在"CSS display:none;"與"CSS display:block;"兩個狀態間切換時,表格的底部會持續的產生多余的空白空間以至于造成頁面布局的扭曲。

解決方法
1、用CSS display:table-row屬性來調試,發現者FireFox下正常了,但IE是不支持改屬性的,怎么辦呢?用JS來做判斷,然后做兼容吧。
2、另外一個很簡單也很可行的方法,就是用display:''這個屬性dispaly后面不加任何的東西,很奇怪,這樣就兼容了Firefox和IE了。

轉載于:https://www.cnblogs.com/mrxiaohe/p/5201950.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/272341.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/272341.shtml
英文地址,請注明出處:http://en.pswp.cn/news/272341.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

docker ps命令詳解 列出運行中的容器

docker ps命令詳解 列出運行中的容器 使用docker ps命令即可列出運行中的容器,執行該命令后,會出現如下7列表格 CONTAINER_ID 表示容器ID IMAGE 表示鏡像名稱 COMMAND 表示啟動容器時運行的命令 CREATED …

Lattice 的 Framebuffer IP核使用調試筆記之datasheet筆記

本文由遠航路上ing 原創,轉載請標明出處。 學習使用以及調試Framebuffer IP 核已經有一段時間了,調試的時候總想記錄些東西,可是忙的時候就沒有時間來寫,只有先找個地方記錄下,以后再總結。所以找這個時間好好的記錄學…

Systick滴答定時器寄存器、delay()延時函數、SysTick_Config函數

SysTick定時器 SysTick定時器,是一個簡單的定時器,對于CM3、CM4內核的芯片都有SysTick定時器。SysTick 是一個 24 位的倒計數定時器,當計數到 0 時,將從RELOAD 寄存器中自動重裝載定時初值,開始新一輪計數。只要不把它…

查看docker容器日志

1:實時查看docker容器id為 02c5ac132ee5 的最后10行日志 docker logs -f -t --tail 10 02c5ac132ee5 2:查看指定時間后的日志,只顯示最后100行: docker logs -f -t --since"2020-02-14" --tail100 d7db22166a0a 3:查看最近20分鐘的…

Web UI 自動化測試環境搭建 (轉載自51測試天地第三十九期上)

1. 安裝 Python 2.7 并設置系統環境變量 2. 下載并安裝 python setuptools Easily download, build, install, upgrade, and uninstall Python packages https://pypi.python.org/pypi/setuptools#installation-instructions 2.1 找到ez_setup.py,點擊右鍵--目標另存…

STM32F1 端口復用、端口(部分和完全)重映射

端口復用功能 STM32 有很多的內置外設(比如:串口、ADC、DAC等是獨立的模塊和內核連接在一起),這些外設的外部引腳都是與 GPIO 復用的。也就是說,一個 GPIO如果可以復用為內置外設的功能引腳,那么當…

docker啟動容器后容器狀態為Exited (137) 5 seconds ago

1:因為容器里的運行的代碼報錯了,然后容器 Exited (1) 3 seconds ago 了,通過 docker logs -f container_id 能看到哪里錯了 容器樁體為exited,說明容器已經退出停止 先查看查看鏡像id ps images 在后臺運行一個容器 為了保證提…

ReflectionClass與Closure

<?php /*** Class A*/ class A{}$obj new ReflectionClass(A); var_export($obj.PHP_EOL); 類后面加上PHP_EOL會把當前類的詳細接口文檔打印出來。 ReflectionClass 可以利用這個動態創建類&#xff0c;動態使用類方法參數。 try{ //如果存在控制器名字的類 if(class_exis…

STM32中斷優先級的管理(NVIC)

STM32 NVIC 中斷優先級管理 CM3 內核支持 256 個中斷&#xff0c;其中包含了 16 個內核中斷和 240 個外部中斷&#xff0c;并且具有 256級的可編程中斷設置。STM32 并沒有使用 CM3 內核的全部東西&#xff0c;而是只用了它的一部分。STM32 有 84 個中斷&#xff0c;包括 16 個…

docker修改容器名字

查看一下容器的名字 這個laughing_elion是下載es時候默認的名字 修改容器名字 docker rename 容器原來名 要改為的名字 最后可以看到容器名已經修改成功

STM32 串行通信原理

處理器與外部設備通信的兩種方式&#xff1a; 并行通信 傳輸原理&#xff1a;數據各個位同時傳輸。優點&#xff1a;速度快缺點&#xff1a;占用引腳資源多 串行通信 傳輸原理&#xff1a;數據按位順序傳輸。優點&#xff1a;占用引腳資源少缺點&#xff1a;速度相對較慢 …

linus下centos7防火墻設置

CentOS7 默認使用firewalld防火墻&#xff0c;如果想換回iptables防火墻&#xff0c;可關閉firewalld并安裝iptables。 1:安裝firewalld服務 yum install firewalld 2、firewalld的基本使用 啟動&#xff1a; systemctl start firewalld &#xff08;關閉后顯示notrunning&a…

串口通信寄存器/庫函數配置、實例編寫

常用的串口相關寄存器 USART_SR狀態寄存器USART_DR數據寄存器USART_BRR波特率寄存器 串口操作相關庫函數&#xff08;省略入口參數&#xff09;&#xff1a; void USART_Init(); //串口初始化&#xff1a;波特率&#xff0c;數據字長&#xff0c;奇偶校驗&#xff0c;硬件流…

使用docker安裝Mongodb

下載mongo3.2的docker鏡像&#xff1a; docker pull mongo:3.2 使用docker命令啟動&#xff1a; docker run -p 27017:27017 --name mongo \ -v /mydata/mongo/db:/data/db \ -d mongo:3.2 查看已經成功啟動

移動端meta標簽

現在的手機或平板電腦等移動設備上的瀏覽器默認都有雙擊放大的設置&#xff0c;如何阻止雙擊放大&#xff1f;user-scalableno <!-- 禁止縮放 --> <meta name”viewport” content”widthdevice-width,initial-scale1.0,maximum-scale1.0,user-scalableno”> <!…

正點原子stm32--串口通信實驗講解里關于USART_RX_STA的問題與思考

這篇博文講的挺詳細的可以參考以下&#xff1a; USART_RX_STA詳解

什么是真正的程序員?

什么是真正的程序員 這篇文章的原文來自&#xff1a;A Little Printf Story作者仿照《小王子》中的情節&#xff0c;通過小printf遇見的不同類型的程序員&#xff0c;最后悟出什么才是真正的程序員&#xff01;第一次翻譯有很多不妥&#xff0c;歡迎留言指正。 文章略長&#x…

為什么會出現docker

docker鏡像&#xff0c;一次構建&#xff0c;到處運行

docker和虛擬機的區別

虛擬機缺點&#xff1a; docker和虛擬機的不同之處&#xff1a;

獨立看門狗實驗

為什么要看門狗 在由單片機構成的微型計算機系統中&#xff0c;由于單片機的工作常常會受到來自外界電磁場的干擾&#xff0c;造成程序的跑飛&#xff0c;而陷入死循環&#xff0c;程序的正常運行被打斷&#xff0c;由單片機控制的系統無法繼續工作&#xff0c;會造成整個系統…