2016-04-06 39 views
0

我剛剛添加了一些新的html元素到一個現有的網站,不受隨行的css規則的影響。當我檢查元素沒有CSS顯示這些HTML元素。我知道該頁面正確鏈接到CSS文件,否則頁面上沒有任何內容會像它應該那樣。該網站可以在http://evolutionhire.com/查看。在耗材部分,我有一系列包含圖像和跨度的div這似乎是不受影響新添加的html元素沒有鏈接到css

<div class="shop-item"> 
     <h1>BONGO TIES</h1> 
     <span class="shop-price"><span class="prices">7 euro</span> per pack</span> 
     <img src="img/bongo.png"/> 
    </div> 

.shop-item { 
    float: left; 
    margin: 10px 56px 0px 0px; 
    text-align: left; 
    position: relative; 
    cursor: pointer; 
    overflow: hidden; 
} 

.shop-price { 
    position: absolute; 
    top: 41px; 
    left: 0; 
    height: 100%; 
    width: 100%; 
    background: rgba(0, 0, 0, 0.7); 
    opacity: 0; 
    transition: 0.6s ease-in-out; 
    padding: 50px 10px 10px 10px; 
    text-align: left; 
    box-sizing: border-box; 
    color: white; 
    font-size: 14px; 
    display: table-cell; 
    vertical-align: middle; 
    line-height: 18px; 
} 
+1

https://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fevolutionhire.com%2Fcss%2Fstyle.css&profile=css3&usermedium=all&warning=1&vextwarning=&lang = en – j08691

+0

你有沒有嘗試過使用其他一些名字'shop_price'而不是'shop-price' –

回答

2

問題在http://evolutionhire.com/css/style.css文件,它是你的CSS塊缺少右大括號:在該行2230

@media only screen and (max-width: 768px) { 
    .product { 
      display: none;      
    } 

    .popup { 
      width: 272px;      
    } 

所以只需加上「}」它應該工作得很好

+0

因此,基本上你的.shop-item類屬於媒體屏幕寬度768,從你的css代碼看來,這個塊應該在class .popup之後關閉,這樣.shop-item類將在全球範圍內提供。 –

+0

謝謝你親切的先生。我今天只添加了媒體查詢,所以我真的應該回頭看看我做了什麼。現在完美運作。我是這個網站的新手。我如何投票或標記你的答案是正確的? – dmc

+0

謝謝。檢查這個http://stackoverflow.com/help/someone-answers –

-1

你的CSS不驗證。錯誤會導致整個文件不能被處理。

檢查你的CSS這裏:https://jigsaw.w3.org/css-validator/#validate_by_input

+0

nope,錯誤只是保持處理有錯誤的屬性。 – jackjop

+0

不,錯誤將停止處理整個文件。 –

+0

好吧,另外}會,你說得對。但如果我寫positiiiiion:絕對不會 – jackjop