Re: [問題] 文字欄位與圖片無法對齊
margin 跟 padding 不一樣喔，
簡單來說前者是外邊距(邊界)；後者是內邊距(補白)。
你可以分別在同樣的 div 上加上框線 border: 3px solid #00f;
最好再給它上個底色 background: #f00;
然後分別設 margin 和 padding 看看，請看例子：
http://www.chweng.idv.tw/test/test.php
如果你都沒指定顏色，兩個看起來確實很像，
但上了邊界和背景色後，很容易就看出差異了。
另外 margin 和 padding 等等的定義值，是可以做適當的縮寫的，詳見這裡：
http://www.chweng.idv.tw/w3cguide/csstips.php
最後提供一個小技巧，當網頁排版有問題的時候，
暫時給有問題的 div 上個色，有些時候可以很容易地找出問題所在喔。
※ 引述《look ()》之銘言：
: img{
: vertical-align:middle;
: }
: 加一句這個就可以了
: 個人的經驗
: firefox解析CSS比較嚴格 顯示的方式跟IE也有少許不同
: 像IE的判斷比較寬鬆，沒有定義的會預設沒有
: 而firefox必須定義的很清楚
: 寫法上要嚴謹一點
: 像margin跟padding最好不要用
: padding-top:10px;
: 這種寫法只適合用在IE
: 上左下右要一起定義，例如
: padding:0px 10px 0px 0px;
: 如果四個數字都一樣寫一個就可以
: margin:0px;
: 另外我覺得
: padding跟margin在FIREFOX裡好像是一樣的
: 在排版上會有困難，所以我都設為0px;
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 220.134.107.22
※ 編輯: chweng 來自: 220.134.107.22 (11/14 00:10)
推
11/14 02:44, , 1F
11/14 02:44, 1F
討論串 (同標題文章)
Web_Design 近期熱門文章
PTT數位生活區 即時熱門文章