MozTW 討論區
https://forum.moztw.org/

firefox 無法置中問題
https://forum.moztw.org/viewtopic.php?f=13&t=21867		 第 1 頁 (共 1 頁)
發表人:  shray [ 2008-03-09, 18:58 ]
文章主題 :  firefox 無法置中問題
我的網站內有個置中問題，在IE上是可以置中，但在firefox下就無法置中了，以下是我用的代碼，使用後整個table 在firefox都偏了左

代碼:
<div style="padding-top: 18px; text-align: center">
      <table width="982px" cellpadding="13" cellspacing="0" border="0" style="background-color: #F6F6F6; text-align: left">
   <tr><td>內容</tr></td></table><div>


我試過改用css來置中，但仍是無效，如果用不符合w3c的方法，即改為用
代碼:
<div style="padding-top: 18px;" align="center">


這就成功了，請問各位這應如何做才可符合w3c又可以firefox下置中呢，請指教，多謝
發表人:  Amauds [ 2008-03-09, 19:15 ]
文章主題 : 
shray 寫:
我的網站內有個置中問題，在IE上是可以置中，但在firefox下就無法置中了，以下是我用的代碼，使用後整個table 在firefox都偏了左

代碼:
<div style="padding-top: 18px; text-align: center">
      <table width="982px" cellpadding="13" cellspacing="0" border="0" style="background-color: #F6F6F6; text-align: left">
   <tr><td>內容</tr></td></table><div>


我試過改用css來置中，但仍是無效，如果用不符合w3c的方法，即改為用
代碼:
<div style="padding-top: 18px;" align="center">


這就成功了，請問各位這應如何做才可符合w3c又可以firefox下置中呢，請指教，多謝


代碼:
<div style="padding-top: 18px; text-align: center">
<table width="982px" cellpadding="13" cellspacing="0" border="0" style="margin:0 auto; background-color: #F6F6F6; text-align: left">
<tr><td>內容</tr></td>
</table>
<div>
發表人:  shray [ 2008-03-09, 19:25 ]
文章主題 : 
多謝Amauds大大，困擾多時，終於成功解決了^^
發表人:  wini [ 2008-03-09, 22:43 ]
文章主題 : 
shray 寫:
多謝Amauds大大，困擾多時，終於成功解決了^^


順便提一下， text-align 是控制文字的， div table 那些的位置不受這控制。

而 width 跟 margin 的搭配，也可以直接用 margin 指定左右同等邊距來處理，不過缺點是換個大螢幕(解析度)就會跑掉，所以指定 width 再讓 margin 左右交給瀏覽器自動調整比較簡單。（只是有可能會有瀏覽器跑出不同的結果）
發表人:  Amauds [ 2008-03-11, 21:50 ]
文章主題 : 
wini 寫:
順便提一下， text-align 是控制文字的， div table 那些的位置不受這控制。
而 width 跟 margin 的搭配，也可以直接用 margin 指定左右同等邊距來處理，不過缺點是換個大螢幕(解析度)就會跑掉，所以指定 width 再讓 margin 左右交給瀏覽器自動調整比較簡單。（只是有可能會有瀏覽器跑出不同的結果）

置中的方式其實要看用在何處，
例如左中右的欄位配置，就看那個欄位最重要，
如果要讓不同解析度呈現一樣的配置，
除了舊式 table 方式的排版外，
用 block 級元素來排版就一定要將重要(不可變)的欄位指定寬度，
代碼:
<div id="contents" style="width:100%;">
<div id="b_left" style="width:200px; float:left;border:1px #ccc solid">左</div>
<div id="b_left" style="width:200px; float:right;border:1px #ccc solid">右</div>
<div id="b_left" style="margin:0 202px 0 202px; border:1px #ccc solid">中</div>
</div>

試試看吧，切換不同解析度比較一下。
ps:掉換 html 書寫順序也會有影響喔，除非使用絕對定位。
發表人:  shray [ 2008-03-21, 00:26 ]
文章主題 : 
多謝兩位大大的指教~~
第 1 頁 (共 1 頁) 所有顯示的時間為 UTC + 8 小時
Powered by phpBB® Forum Software © phpBB Group
https://www.phpbb.com/