推 rainpo17:sj大~真是太感謝你了!我會好好試一下~ 06/09 08:23
※ 引述《rainpo17 (貼)》之銘言:
: 這兩個瀏覽器用css編起來,怎麼差別這麼大?
: http://users3.jabry.com/visource/test/com.html
: 各位高手可以幫我看一下嗎?我不懂為什麼我把tag名稱換掉
: 有一個按鈕會跑到右上方,ie看起來是這樣
因為有按鈕的postion設定不一樣
: 但,用ff看起來更是恐怖,整個像是撞鬼一樣....
ff的結果才是正常的,因為沒有定義最外面box div的寬度
所以全部的圖片都會自動排列成最寬的情況
必須給box一個寬度,限制超過範圍的物件自動換行
: 請問各位是怎麼coding?可以適用於各式瀏覽器啊?
: 我的腦容量嚴重不足,有推薦的軟體或討論區嗎?
: 把table整個改成css....自己coding...對於新手而言,好可怕的龐大工作呀
: 非常感謝高手們~
用回的比較快!
不專業見解
1. com-menu.html
最外層的ID=box把所有的屬性拿掉只留下margin:0;和padding:0;
並且加上width:800px
這樣就可以直接把此區塊無邊界對齊並且設定區塊寬度範圍
2. box 這個div最後有<p></p>的多餘空行,請刪掉
3.版權宣告的<center>不是正確用法,請改成<p align="center">內容</p>
4.選單中所有按鈕的position:relative;以及長寬設定都拿掉
(因為容器中有固定的圖片,所以長寬會自動設定)
如此選單的部份應該就會正常了
至於其他版面錯亂的部份因為涉及到浮動屬性和容器高度的限制,必須調整版面結構才行
表格改成css第一件事情就是要分析版面的結構
要善用div的巢狀排版,通常選單的部份會另外用一個div裡面在放入選單按鈕
單純用表格排版的思維去轉換成css排版會變很複雜
==
大部分編寫的狀況下只要謹慎使用postion和注意margin的問題
其實相容度都還不錯
只是對於需要大量圖片構成的版面就要很小心
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 125.230.71.184