Close

[joomla][1.5] 橫向選單高度修正與版面置中處理 for IE6

最近修改joomla1.5的網頁時總是遇到選單造成高低的落差問題
可能上網抓的佈景主題都有狀況吧…
 
現在的佈置主題使用在 ie8 、 FF 上都比較不會有版面跑掉的問題…
不過ie6就慘了…
變ie6以後 版面可能不會置中…選單可能會出問題…
 
怎麼修正呢?
 
我花了點時間又在搞修正了很討厭
以下是我修正時的簡單處理方法
 
1.首先是橫向選單高度修正的問題:
 
跑去修改佈景主題的css…
有兩個項目,把這兩個項目的高度限定住就行了,以下紅色會增加部分
#ja-mainnavwrap {
……………………………..(省略)
height:25px;
}
#ja-mainnav {
……………………………..(省略)
height:25px;
text-align: left;

}
 
說明:
#ja-mainnavwrap 為最外層一圈的選單樣式名…
把上面的高度限定住就不會跑掉了…
 
#ja-mainnav 為往內一圈的選單樣式名…
把上面的高度限定住就ok了
 
兩者都限定是避免外觀上在ie6上會出問題…當然可以自已決定適合的高度…
這方面就多用點試誤法吧…
 
至於#ja-mainnav 為什麼要加上 text-align: left; 這個項目…
這樣就可以確定選單的文字會向左對齊…
不過如果你的選單項目過多…這個就又要找別的方法處理了…
 
2.版面置中的問題:
 
用ie6有可能會造成原本置中變成置左的情形..
 
因為經驗的問題,所以我的處理方法是使用table標籤來處理…
這邊需要了解html語法哦…!
跑去佈景主題中修改html
 
對於你要置中的區塊就加入下面的標籤吧…
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
      <td>
                 這邊是表格內要置中的內容物的程式碼
      </td>
  </tr>
</table>
此表格已設定無邊框無厚度了,所以可以說是一個乾淨的區塊
這樣就可以確保在表格內的區塊可以置中嘍!!
 
如果區塊內的文字也跟著置中的話…請再對各區塊的css加入 text-align: left; 這個元素哩!!
 
 

發表留言

%d 位部落客按了讚: