IronMocha IronMocha - 7 months ago 23
HTML Question

Editing bootstrap CSS to hide an image

I've got an image that is displayed when viewing the website on a computer; however, I want it to be hidden when the site is viewed on a mobile device. I've just used the 'display: none;' CSS but for some reason it's not working.

HTML:

<div class="col-sm-7 col-sm-offset-1">
<img src="./images/testing.jpg" alt="">
</div>


CSS:

.col-sm-7 {
display:none;
}


Thank you.

Answer

Just add the class hidden-xs and/or hidden-sm.

See the docs for more info