[請益] header 導覽列呈現按鈕順序巔倒的問題

作者: SophiaH (Sophia)   2014-06-18 19:27:44
大家好, 第一次在 dreamweaver 遇到此導覽列呈現按鈕順序巔倒的問題
首頁 header 導覽列碼如下,
<div id="header">
<h1>公司名</h1>
<ul>
<li class="aboutus"><a href="aboutus.html">關於我們</a></li>
<li class="news"><a href="news.html">最新活動</a></li>
<li class="courses"><a href="courses">課程介紹</a></li>
<li class="contactus"><a href="contactus">聯絡我們</a></li>
<li class="location"><a href="location">位置環境</a></li>
</ul>
</div>
CSS layout :
#header li{
float:right;
list-style-type:none;
}
#header li a{
display:block;
background-image:url(image/....);
width:100px;
height:60px;
text-indent:-9999px;
}
F12 後導覽按鈕由左至右順序卻是: 位置環境->聯絡我們->課程介紹->最新活動->
關於我們
請問原始碼設定哪裡有問題嗎 ? 謝謝
作者: dinos (守護神)   2014-06-18 19:41:00
float:right;
作者: banjmin (HD)   2014-06-18 19:43:00
改成float:left; 就好了
作者: SophiaH (Sophia)   2014-06-18 20:15:00
謝謝兩位, but 改成 left 後靠左感覺跟一般網頁不同..可能導覽按鈕太少, 該加什麼設定讓它往右移呢 ? Thks.
作者: GoalBased (Artificail Intelligence)   2014-06-18 22:27:00
你把li順序顛倒 改回本來的 right阿= =我自己的話 可能會加padding吧
作者: Rplus (R+) (9527)   2014-06-19 02:19:00
ul 設定 float:right 或許會比較適合你希望將右側填滿的需求至於image-replace(IR) 你或許可參考一些新方法EX: http://0rz.tw/XY9Qh
作者: SophiaH (Sophia)   2014-06-19 16:51:00
謝謝 R大喔, 我再用力研究看看

Links booklink

Contact Us: admin [ a t ] ucptt.com