Search code examples
cssstylesoverriding

Overriding css style?


I look on Stack Overflow, and didn't find the solution, I know how to override style if style exists, just change its property. But now I have a strange style to override

Here is an example of what I have

First I have this one:

.slikezamenjanje img{
    max-width: 100%;
    max-height:150px;
    padding-right:7px;
}

Now I need to override that style with just this one:

#zoomTarget .slikezamenjanje img {
    max-width: 100%;
}

The problem is that first style appends second, but I don't want that, in this second style what I need is just one line, not to append from the first style?


Solution

  • Instead of override you can add another class to the element and then you have an extra abilities. for example:

    HTML

    <div class="style1 style2"></div>
    

    CSS

    //only style for the first stylesheet
    .style1 {
       width: 100%;      
    }
    //only style for second stylesheet
    .style2 {
       width: 50%;     
    }
    //override all
    .style1.style2 { 
       width: 70%;
    }