看板 Web_Design 關於我們 聯絡資訊
其實有一個bug技 <div id="container"> <div id="left">左方欄</div> <div id="right">右方欄</div> </div> 在左右兩欄都加入以下屬性 padding-bottom:10000px; margin-bottom:-10000px; 然後在外面那層加入 overflow:hidden 整理後css如下 #container { width:1000px; /*自行修改*/ overflow:hidden; } #left { width:500px; /*自行修改*/ float:left; padding-bottom:10000px; margin-bottom:-10000px; } #left { width:500px; /*自行修改*/ float:left; padding-bottom:10000px; margin-bottom:-10000px; } 沒意外的話就會左右兩欄等高了 可以在左右兩欄都加上背景顏色檢查看看 ※ 引述《terlin10 (小Ya)》之銘言: : ※ 引述《luciya (浮雲翩躚)》之銘言: : : http://www.feu.edu.tw/adms/sdc/IDC/index.html : : 這是我之前做網頁所遇到的難題 : : 左方那一個區塊無法依右方的高度來變化 : : 不知道有沒有相關的解決辦法呢??? : : p.s.CSS的原始碼按右鍵就可以看到了 : : 在此先感謝您的解答^^ : 雖然我沒有實際做過 : 但是我的想法是這樣的… : 用一個DIV包住左右兩個區塊 : 假設其id為wrap : 然後設wrap的background-color為你左方的區塊的顏色 : 這時候左邊區塊的顏色不要設定,這樣就會是wrap的背景色 : 相對的,右方區塊的顏色要設為white(依你網站的顏色) : 最後再包一個空的div區塊在最後,假設其id='clear' : 這時候的狀況應該是這樣… : <div id='wrap'> : <div id='left'>content</div> : <div id='right'>content</div> : <div id='clear'></div> : </div> : 最後再設css... : #clear{ : margin:0; : padding:0; : border:0; : clear:both; : } : 這樣應該可以達到你要的效果了 : 不過正如一開始所說… : 我沒測過,但是理論上應該ok吧! : 有誤還請神人幫忙更正,謝謝 -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 61.223.224.5
luciya:讚讚讚~~~這個bug技好用耶~,太感謝您了(~^O^~) 05/16 17:42
Rplus:同樣的html結構 #countainer{backgroundcolor:#XXX;} 05/17 17:41
Rplus:#right{background-color:#FFF;} 05/17 17:44
konois:學習了! 05/18 13:44