I wanted to have large pictures be hidden for mobile devices. Looking at this site I put the following styles in my css:
//medium+ screen sizes
@media (min-width:992px) {
.desktop {
display:block !important;
}
}
//small screen sizes
@media (max-width:991px) {
.mobile {
display:block !important;
}
.desktop {
display:none !important;
}
}
Then I apply the class in my html like this:
<img class="desktop" src="img/test/test.jpg"
alt="jhkjhjk" height="600" width="900">
But when I shrink my browser window the image remains there. Have I missed something?