CSS最初沒有加載

Question

我以前有過更長的問題，但我認爲這將是最容易找到的位置。當我最初加載我的頁面時，navigationBanner中的一些項目會移位。但是，當我在文本框中輸入訂單號並重新加載之後......所有事情都應該在哪裏。我假設我的CSS沒有加載時，它應該是，但我不完全確定，因爲我完全noobish在HTML和CSS。

任何人都可以向我解釋這個嗎？

這裏是我的導航欄HTML

<div id="background"><img src="images/blue%20background.jpg" alt="background" width="100%" height="100%" /></div> 
    <div id="header"> 
     <div id="navigationContainerWrap"> 
      <div id="navigationBanner"> 
       <a href=""> 
        <img src="images/facebook.png" alt="Facebook Link" border="0" style="margin: 4px 0 5px 44px;" /></a> 

       <a href=""> 
        <img src="images/twitter-2.png" alt="Twitter Link" border="0" style="margin: 4px 0 5px 2px;" /></a> 

       <a href=""> 
        <img src="images/pinterest-icon.png" alt="Pinterest Link" border="0" style="margin: 4px 0 5px 2px;" /></a> 

       <img src="images/txtNewCustomers.png" alt="New Customers txt" style="margin: 0px 0 5px 50px;" /> 

       <img src="images/txtExistingCustomers.png" alt="Existing Customers txt" style="margin: 0 0 5px 50px;" /> 

       <a href=""> 
        <img src="images/email.png" alt="Email Link" border="0" style="margin: 4px 10px 6px 0; 
         float: left;" /></a> 

       <p style="float: left;"> 
        1.800.BLAH.BLAH</p> 

       <a href=""> 
        <img src="images/btnOrder.png" alt="New Customers Button" border="0" style="float: left; 
         margin: 0 0 0 45px;" /></a> 

       <a href=""> 
       <img src="images/btnLogIn.png" alt="Log in Button" border="0" style="float: left; 
           margin: 0 10px 0px 25px;" /></ 


      <!-- Order tracking Form input -->  
       <div class="trackingInput"> 
        Order Status<br /> 
        BloopBloop Order Number:<br /> 
        <input id="txtOrderID" type="text" onkeydown="if (event.keyCode == 13) document.getElementById('btnOrder').click()" /> 
       <input type="button" id="btnOrder" value="Submit" onclick="return btnOrder_onclick()" />    
       </div> 

</div> 

Annnnd我相信這是有關CSS

.trackingInput 
{ 
    float: right; 
    /*padding: 0 5px 0px 0;*/ 
    z-index: 35; 
    font-weight: normal; 
    font-family: "Century Gothic"; 
    height: 85px; 
    margin-top: -45px; 
    position: relative; 
    margin-left: -1px; 
    width: 178px; 
} 

#navigationBanner 
{ 
    background-color: black; 
    background-repeat: no-repeat; 
    height: 85px; 
    width: 600px; 
    float: right; 
    color: White; 
    font-weight: bold; 
    font-size: small; 
} 
#navigationContainerWrap 
{ 
    background-position: center; 
} 
#header 
{ 
    background-color: White; 
    background-image: url(../Images/GenericLogo.png); 
    width: 960px; 
    height: 140px; 
    background-repeat: no-repeat; 
    margin: 0 auto; 
    position: relative; 
    z-index: 10; 
} 

提前感謝！並抱歉信息超載。

Answer 1

可能性：

1. 你不發出相同的CSS兩次
2. 你不發出相同的HTML兩次（例如，你使用不同的標籤和/或類）

一種方法來跟蹤下來使用Internet Explorer：

1. 裝入第一頁（如您EXPE不工作的一個CT）在IE
2. 命中F12打開開發工具
3. 點擊箭頭圖標開發工具，進入選擇模式
4. 點擊網頁中的AA部分未正確顯示
5. 點擊跟蹤樣式選項卡（開發人員工具）
6. 探索的風格樹，看看每一種風格是從