Media Query for Mobile

Develop, Build & Integrate CMS Development
2

Hi @christinacschne,

it’s pretty simple. If your object has a Class or an ID you can hide it with following solution:

@media screen and (max-width:XXX px){
.your-class{
display:none;}
}
@media screen and (max-width:XXX+1 px){
.your-class{
display:block;}
}

For example:

if you want to hide your element on smartphones(most likely 480px width;iPhones have different/other resolutions) your code should look like this

@media screen and (max-width:480px){
.your-class{
display:none;}
}
@media screen and (max-width:481 px){
.your-class{
display:block;}
}

You can find a list of media queries here

regards

Anton

| | Did my post help answer your query? Help the Community by marking it as a solution |
| — | — |