spoloso spoloso - 29 days ago 6
HTML Question

class not work after use in media screen CSS

I have below style in my style.css:

.adbox {
background: #304254;
padding: 5px;
border-radius: 4px;
width: 468px;
height: 66px;
position: relative;
float: left;
margin-left: 20px;
margin-top: 60px;
}


Now I used it in media screen code for responsive, like below:

@media only screen and (max-width : 992px) {
/* -=>Meta */
.meta {
margin-bottom: 15px;
}

/* -=>Blog Block */
.blog-block h2 {
margin: 15px 0 10px 0;
}
.blog-block .summary {
height: auto;
}

.adbox {
background: #304254;
padding: 5px;
border-radius: 4px;
width: 458px;
height: 66px;
position: relative;
float: left;
margin-left: 231px;
margin-top: -111px;
}

}


HTML:

<div class="adbox">
<a href="google.com">
<img class="img-responsive tablighatextra" src="0098.in/uyedfuygwecgeifg/wp-content/uploads/2016/11/…; alt="تبلیغات" />
</a>
</div>


Now it not work and in inspect element all code is not usable:

enter image description here

and HTML code is below:

<div class="adbox"><a href="http://google.com"><img class="img-responsive tablighatextra" src="http://0098.in/uyedfuygwecgeifg/wp-content/uploads/2016/11/814d302fbaf4ba308e6eba7a7e7b6f28.gif" alt="تبلیغات" /></a></div>

Answer

Try adding !important at the end of each style for example padding: 5px !important;