FireFox中顶层高宽比不影下层的处理方法

2021-03-14 19:02 jianzhan

在写网站时,遇到1个差点儿让我抓狂的事儿。下列是1个很简易的网页页面:


提醒:您能够先改动一部分编码再运作


在这个网页页面中,建立了3个层,上面两个层是并列的,下面1个层是独立的,在IE中访问能够做到我要想的結果,以下图所示:

    在上图中,左侧的层用于輸出文章内容內容,右侧的层用于輸出树型菜单,下面的层用于輸出版权信息内容。全部网站都做完以后,忽然想起在FireFox中检测1下实际效果,看看是不是适配,想不到在Firefox中的实际效果竟然彻底不一样。以下图所示。

    从上图中能够看出,左侧的层并沒有将下面的层“挤”下去,而是超出了下面的层。这么1来,版权信息内容就会横在文章内容內容当中了。假如仅仅只是Firefox是这样的话,也即使了,但是连Opera、Flock全是这类显示信息結果,让我迫不得已改了,科学研究了很久,终究让我寻找了1个处理方式,便是在下面的层上再加 “clear:both”,以下所示:


提醒:您能够先改动一部分编码再运作

最终結果以下所示,1切OK。