2015-11-07 47 views
0

我的網站在.aspx頁面中顯示不同的輸出,同時使用相同的結構&在html頁面中的CSS它顯示正確的輸出,但在apsx頁面css崩潰。我檢查兩次代碼兩次&它是相同的,但輸出變得不同。在html和aspx中的CSS結構變化頁面

HTML頁面輸出 enter image description here

ASPX頁面輸出 enter image description here

HTML代碼

<!--bg-img-container-starts--><div class="bg-img-container"> 
     <!--bg-img-starts--><div class="bg-img"> 
      <!--header-starts--><div class="header"> 
       <!--logo-starts--><div class="logo"> 
        <h2><a title="Quista" href="#">Quista</a></h2> 
       </div><!--logo-ends--> 

       <!--menus-starts--><div class="menus"> 
        <ul class="nav"> 
        <li><a href="#">Home</a> <div class="pipe"></div></li> 
        <li><a href="#">Services</a></li> 
        <li><a href="#">Pricing</a></li> 
        <li><a href="#">Track Orders</a></li> 
        <li><a href="#">About Quista</a></li> 
        <li class="call"><a href="#">Call Us :- +91 1234 1245</a></li> 
        </ul> 
       </div><!--menus-ends--> 
      </div><!--header-ends--> 
     </div><!--bg-img-ends--> 

CSS

html, body{ 
    margin:0; 
    padding:0; 
    width:100%; 
    height:100% 
} 

.clear{clear:both} 

body{ 
    font-family:'Quicksand', sans-serif; 
} 

.bg-img-container{ 
    width:100%; 
    position:relative; 
    height:100% 
} 

.bg-img{ 
    width:100%; 
    max-height:768px; 
    height:100%; 
    background:url(../Images/0000.jpg) no-repeat; 
    background-size:cover; 
} 

.header{ 
    width:100%; 
    max-width:1200px; 
    position:relative; 
    margin:0 auto; 
    padding:15px 0 0 0 
} 

.logo{ 
    width:20%; 
    display:inline-block; 
} 

.logo h2{ 
    font-family:'MyriadPro-BoldCondIt'; 
    font-size:4em; 
    padding:0; 
    margin:0; 
    letter-spacing: 5px 
} 

.logo a{ 
    color:#fff; 
    text-decoration:none 
} 

.menus{ 
    width:79%; 
    display:inline-block; 
} 

.nav{ 
    marging:0; 
    padding:0 
} 

.nav li{ 
    display:inline-block; 
    list-style:none:none; 
} 

.nav li a { 
    padding:15px 25px 15px 25px; 
    color:#fff; 
    text-decoration:none; 
    display:block 
} 

.nav li a:hover{ 
    border-bottom:2px solid #FFF 
} 

.call{ 
    background:#df6b5e; 
    border-radius:50px 
} 

.call a{ 
    font-weight:bold; 
    padding:15px 25px 15px 25px !important 
} 

.call a:hover{ 
    border:none !important 
} 

我認爲問題是與頂格(img- bg-container),因爲在css中,我給出了高度100%&它是子div div:height:768px。雖然問題解決,如果我保持最小高度,而不是aspx頁面中的最大高度,但如何在代碼相同時顯示不同的輸出。

+0

你確定目錄結構仍然是一樣的嗎?該頁面可能無法找到一些資源(圖像,樣式表...)或者,服務器如何處理路徑名稱中的大小寫不匹配可能存在dfferences –

+0

@MrLister是的所有內容都與aspx頁面和html頁面相同目錄本身&與相同的CSS文件鏈接。而且我只有在我的問題中提到頂級div時纔有問題。在html文件中,潛水高度100%覆蓋整個屏幕,並且在aspx頁面div高度100%不起作用。 –

回答

0

做一件事。右鍵單擊頁面並選擇檢查元素。並檢查頁面html和css。這將是很容易比較,並找出哪個CSS不工作。

同時檢查表單標籤css,因爲我們將表單標籤放置在所有HTML標籤和asp.net中的body標籤內。通常HTML頁面沒有這樣的結構。檢查並讓我知道。