2016-04-06 44 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