跳鏈路和7

我創建了一個在線即時信使這在理論上（編程是點上），但視覺缺乏在IE 6和7跳鏈路和7

今天basicaly我決定工作正常將其剝離並重新開始，但仍然遇到鏈接/按鈕的相同問題，點擊時會顯示聯繫人jumbs 5px。我無法弄清楚。

有在http://www.actwebdesigns.co.uk/ACT_instant_messenger

有點演示的HTML基本上是：

<div id="im_wrapper_fixed"> 
<div id="im_sub_wrapper"> 
    <div id="chat_con_wrapper"> 
    </div> 
    <ul id="contacts_box"> 
     <li id="trigger_details"> 
      <ul class="trigger" id="trigger_wrapper"> 
       <li style="height: 1%;"> 
        <ul> 
         <li id="contacts_header_bar"> 
          <span>Contacts</span> 
         </li> 
         <li id="contacts_details"> 
          <ul> 
           <li id="user_name"><strong>e-jackson</strong></li> 
           <li id="user_status">Status: Online</li> 
           <li id="option_buttons"><a id="force_offline" href="#"><img height="15" width="15" alt="Set Offline" src="../IM/images/red-beacon.jpg"></a><a id="force_away" href="#"><img height="15" width="15" alt="Set Away" src="../IM/images/orange-beacon.jpg"></a><a id="force_online" href="#"><img height="15" width="15" alt="Set Online" src="../IM/images/green-beacon.jpg"></a></li> 
          </ul> 
         </li> 
         <li id="contacts_list"> 
          <ul> 
           <li class="contact"><em>no contacts online</em></li> 
          </ul> 
         </li> 
        </ul> 
       </li> 
      </ul> 
     </li> 
     <li id="contacts_trigger_wrapper"> 
      <a href="#" id="contacts_trigger">(0) contacts</a> 
     </li> 
    </ul> 
    <div class="clear"></div> 
</div>

和接觸箱的CSS：

/* CONTACTS LIST BOX */ 
#contacts_box { font-size:12px; width:200px; display:inline; float:left; text-align:left; height:305px; overflow:hidden; } 
#contacts_header_bar { width:198px; height:15px; overflow:hidden; background-color:#39C; margin:0; padding:0; } 
#contacts_details { width:198px; height:55px; overflow:hidden; border:1px solid #404040; border-left:none; border-right:none; background-color:#F90; } 
#contacts_list { height:240px; overflow:auto; background-color: #FCC; } 
#contacts_list ul { } 
#contacts_list li { } 
#contacts_list li a, #contacts_list li a:visited, #contacts_list li a:hover { text-decoration:none; color:#404040; display:block; } 
#contacts_list li a:hover { cursor:pointer; } 
#contacts_list li span.con_name { display:block; width:145px; } 
#contacts_list li span.con_status {} 
#trigger_details { display:block; height:273px; border:1px solid #404040; background-color:#0C3; } 
#trigger_wrapper { height:203px; width:198px; overflow:hidden; } 
#contacts_trigger_wrapper { width:198px; height:28px; border:1px solid #404040; background-color:#F4F4F4; } 
#contacts_trigger { display:block; } 
#contacts_trigger:active, #contacts_trigger:visited, #contacts_trigger:hover { color:#404040; } 
#force_online, #force_offline, #force_away { font-size:10px; text-decoration:none; color:#404040; width:15px; height:15px; display: block; float:left; margin-top:3px; } 
#contacts_box #trigger_details .trigger { display:none; }

任何幫助很大讚賞。

來源

2010-05-29 Phil Jackson

如果你想要我的意見，不要打擾IE6的支持。已過時的瀏覽器。 – 2010-05-29 12:30:37

@Jake - 不是我不同意，IE6應該是DIAF，但問題包括IE7，在大多數情況下你不能忽略它。 – 2010-05-29 12:39:50

@Nick我知道，我只是想說明關於IE6的一點，這就是爲什麼我發佈了評論而不是答案。有趣的是，根據維基百科，IE7的市場份額低於IE6。 http://en.wikipedia.org/wiki/Template:Msieshare1可能是由於Vista被視爲失敗。我猜，至少有8個獲勝。 =/ – 2010-05-29 12:48:43

它不是一個真正的解決方案，但我重新構造使用divs而不是ul's和li's。

來源

2010-05-29 18:31:02

回答

相關問題