|
筆記 |
060529／Mon
有關CSS、浮動原件與火狐的慘痛經驗 (未完)
- 使用了FLOAT之後，不管有沒有用DIV隔開其他元件，
浮動元件與不要被浮動元件影響到的其他元件之間一定要插入一個有clear="all"的標籤。
事實上，某些情況下浮動原件會破壞外層區塊的底圖顯示。
請務必記得使用→clear="all"
- 不管區塊型元件被指定了什麼單位的什麼寬度，
沒有斷行、沒有空白的半形英數字串(常見於非常多的.或=)以及被<a></a>夾註的URL還是會熊熊的衝破一切阻礙...
因為火狐不會從中打斷半形英數符號，雖然說應該沒有人會覺得一長串的.................或--------------有什麼不能被打斷的理由(且我所知IE也無法自動切斷長串的半形小圓點)，同上http://someURL.like.this/Is/veryLONG/that.you?__may=wish&_your=WebBROWSER&cut=itOFF
或是 被<a href="網址網址"></a>夾註成超連結的無敵長的字串，火狐都不會自動斷行……
http://someURL.like.this/Is/veryveryveryLONG/that.you?__may=wish&_your=WebBROWSER&cut=itOFF
另外，FLOAT的文繞圖效果也有可能因為同樣的原因被打斷，如下圖所示
- 通常的情況而言，DIV的display屬性用block 就可以了；
這也是DIV標籤的預設值。
但是當你看到不同區塊的文字發生預期之外的互相重疊，而你強烈的希望區塊與區塊之間能自動排開彼此，請試試把重疊區塊中，位於原始碼比較上面的那一個區塊的display屬性更改為 table。
display: table;
[未完，近日內補完與補圖]