[問題] 讓DIV的高度在firefox中自動延伸
請問一下，
我設置了一個DIV的區塊包了背景，
原本設置了高度，但是發現有其他頁面內容超出
而且長短不依，所以希望它可以自動延伸。
在IE，用height:auto;就會自動延伸了，
但是在火狐中卻不行，設auto的話他整個都不見了= ="(有點奇怪，但是這個
Div裡面是有包內容的)
所以想來請問是哪裡出問題，或是用什方法讓height在火狐裡面也可以自動延伸
以下是原本的CSS：
#brg{/*中間主要區段背景兩側陰影*/
width:839px;
height:743px;
*height:auto;
text-align:center;
margin:auto;
background-image:url(images/shadow_main.png);
padding:0px;
}
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 211.21.159.184
推
09/17 19:15, , 1F
09/17 19:15, 1F
→
09/17 19:17, , 2F
09/17 19:17, 2F
→
09/17 20:28, , 3F
09/17 20:28, 3F
→
09/17 21:55, , 4F
09/17 21:55, 4F
→
09/17 22:42, , 5F
09/17 22:42, 5F
→
09/17 22:43, , 6F
09/17 22:43, 6F
→
09/17 22:43, , 7F
09/17 22:43, 7F
→
09/17 22:45, , 8F
09/17 22:45, 8F
→
09/17 22:46, , 9F
09/17 22:46, 9F
→
09/17 22:47, , 10F
09/17 22:47, 10F
→
09/17 22:47, , 11F
09/17 22:47, 11F
推
09/17 23:24, , 12F
09/17 23:24, 12F
→
09/17 23:42, , 13F
09/17 23:42, 13F
→
09/17 23:42, , 14F
09/17 23:42, 14F
→
09/17 23:42, , 15F
09/17 23:42, 15F
→
09/17 23:43, , 16F
09/17 23:43, 16F
推
09/17 23:52, , 17F
09/17 23:52, 17F
#brg裡面，我主要是包了.main和.banner(還有其他，先砍除一個一個測試)
原本的高度743是以首頁的內容定的，之後沒想到其他頁面竟然會長短差距那麼大，
但仍希望他們可以共用，所以才想要讓他自動延伸。
目前的問題是，display:table和heght:100%的做法可以成立，但原本用
position數質的似乎都要修改，不然#brg似乎不覺得那些東西包在他裡面
(這個說法好奇怪，不過找不到更好的形容了)，背景沒延伸，看起來很像一個區塊
疊直接在背景上(大概像APDIV的感覺)。
對CSS一知半解所以用試誤的...(淚)
現在是這樣修改
原本的-------------------------------------------------
#brg{/*背景兩側的陰影*/
width:839px;
height:743px;
*height:auto;
text-align:center;
margin:auto;
background-image:url(images/shadow_main.png);
padding:0px;
}
#main2{/*中間主要區段*/
width:825px;
height:743px;
*height:auto;
text-align:center;
background:#FFF;
top:87px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
.banner{
height: auto;
width:814px;
background-color:#039;
position:absolute;/*FF 根據父層DIV 定位判斷top位置*/
margin:5px;
*position:relative;/*IE7 根據文件原基準判斷位置*/
}
現在------------------------------------------------------------
#brg{/*背景兩側的陰影*/
width:839px;
*height:auto;
text-align:center;
margin:auto;
background-image:url(images/shadow_main.png);
padding:0px;
display:table;
}
#main2{/*中間主要區段*/
width:825px;
height:100%;
*height:auto;
text-align:center;
background:#FFF;
top:87px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
.banner{
height: auto;
width:814px;
background-color:#039;
float: inherit;
padding:5px 7px 5px 7px;
}
接下來還要把原本的欄位一個一個放回去看會不會有什麼問題Orz
aceone大建議的兩個數值我上網找了一下還式看不太懂用法~|||所以先擱著
新手上路如果有什麼很爆笑的地方請儘管笑(欸？)
※ 編輯: oj113068 來自: 61.59.19.62 (09/18 00:31)
推
09/18 01:06, , 18F
09/18 01:06, 18F
→
09/18 01:07, , 19F
09/18 01:07, 19F
→
09/18 01:09, , 20F
09/18 01:09, 20F
→
09/18 01:20, , 21F
09/18 01:20, 21F
今天繼續奮鬥Orz
clear:both的用法我上網找了一下，正在研究中T_T
不過目前我把中間包的不需要靠左的float先去除
那個，再請問什麼叫做自適高度？
※ 編輯: oj113068 來自: 203.73.175.192 (09/18 21:16)
→
09/18 21:29, , 22F
09/18 21:29, 22F
→
09/18 21:30, , 23F
09/18 21:30, 23F
也沒什麼，就是會隨內容物自動延伸Orz
目前看起來應該是float的關係，float刪除以後#brd就隨內容撐開了
所以我先把內容按照垂直順序做橫向的DIV，需要用float的再全部包進最裡面
※ 編輯: oj113068 來自: 203.73.175.192 (09/18 21:57)
→
09/18 21:55, , 24F
09/18 21:55, 24F
→
09/18 22:02, , 25F
09/18 22:02, 25F
→
09/18 22:03, , 26F
09/18 22:03, 26F
對，以前看CSS的書有看過他說float會「脫離版面」，有點不懂
現在有點懂了XD"
不過之前嘗試的時候把float:left改成float:inherit也可以讓他被父層的DIV撐開
如果方便的話請給我連結~Q口Q 謝謝
※ 編輯: oj113068 來自: 203.73.175.192 (09/18 22:13)
※ 編輯: oj113068 來自: 203.73.175.192 (09/18 22:14)
→
09/18 22:19, , 27F
09/18 22:19, 27F
→
09/18 22:21, , 28F
09/18 22:21, 28F
→
09/18 22:21, , 29F
09/18 22:21, 29F
Web_Design 近期熱門文章
PTT數位生活區 即時熱門文章
