1 Accepted solution
hide/show module on mobile
SOLVE@MNault Try either putting them each in a group wrapper with their classes on it or add !important to the styles cause looks like there's a display: block on the widget-span class that's overwritting the media queries.
<style>
@media (min-width: 601px) {
.mobilescreen {
display: none !important;
}
}
@media (max-width: 600px) {
.widescreen {
display: none !important;
}
}
</style>
 | If this answer solved your question, please mark it as the solution. |
 | Alyssa WilieWeb Developerat Lynton |  |
 |
hide/show module on mobile
SOLVE@MNault Try either putting them each in a group wrapper with their classes on it or add !important to the styles cause looks like there's a display: block on the widget-span class that's overwritting the media queries.
<style>
@media (min-width: 601px) {
.mobilescreen {
display: none !important;
}
}
@media (max-width: 600px) {
.widescreen {
display: none !important;
}
}
</style>
| If this answer solved your question, please mark it as the solution. |
| Alyssa WilieWeb Developerat Lynton | |
|
hide/show module on mobile
SOLVE@MNault You can add the following media queries either to the template's stylesheet, the template <head>, or in the additional head markup of the page's settings.
<style>
@media (min-width: 601px) {
.mobilescreen {
display: none;
}
}
@media (max-width: 600px) {
.widescreen {
display: none;
}
}
</style>
| If this answer solved your question, please mark it as the solution. |
| Alyssa WilieWeb Developerat Lynton | |
|
hide/show module on mobile
SOLVEI dropped it into the page settings HEAD and it did not work when I checked it on my phone. So I dropped it into the template HEAD markup and still nothing. I must be doing something wrong. Just to confirm, I have given the Rich Text modules the class of "widescreen" and "mobilescreen" like image. Is this correct?
