html.de - Html-Navigation wird auf Smartphone/Tablet nicht angezeigt
by SpiceLab
HTML
<div class="mobilepreview">
<div class="mediumScreenDisabled">
<div align="center">
<table>
<tr>
<td align="center"><a href="http://www.wolfsbrut.com/produktionen/televisionen-vom-glaubensarsenal-4/"><img src="http://i255.photobucket.com/albums/hh125/cxmller/Skippfeile/Skip-Pfeil%20Links%202016_zpsabfglnq9.png" width="80" height="80" border="0" alt="Pfeil Links"/></a></td>
<td align="center"><a href="http://www.wolfsbrut.com/produktionen/televisionen-vom-glaubensarsenal-3/"><img src="http://i255.photobucket.com/albums/hh125/cxmller/Skippfeile/Skip-Pfeil%20Oben%202016_zpsv2ltkuzx.png" width="80" height="80" border="0" alt="Pfeil Oben"/></a></td>
<td align="center"><a href="http://www.wolfsbrut.com/produktionen/televisionen-vom-glaubensarsenal-2/"><img src="http://i255.photobucket.com/albums/hh125/cxmller/Skippfeile/Skip-Pfeil%20Rechts%202016_zpsz3sh02c9.png" width="80" height="80" border="0" alt="Pfeil Rechts"/></a></td>
</tr>
</table>
</div>
</div>
</div>
CSS
/*@media screen and (min-device-width: 1024px) {
.mediumScreenDisabled { display:block }
.smallScreenDisabled { display:block }
}
@media screen and (max-width: 1024px) {
.mediumScreenDisabled { display:none }
}
@media screen and (max-width: 568px) {
.smallScreenDisabled { display:none }
}
@media screen and (min-width: 1024px) {
.mobilepreview .mediumScreenDisabled { display:block }
.mobilepreview .smallScreenDisabled { display:block }
}
@media screen and (max-width: 1024px) { .mobilepreview .mediumScreenDisabled { display:block } }
@media screen and (max-width: 568px) { .mobilepreview .smallScreenDisabled { display:none } }*/
/* Testcase */
.mediumScreenDisabled { display:none }
@media screen and (min-device-width: 1024px) {
.mediumScreenDisabled { display:block }
.smallScreenDisabled { display:block }
}
@media screen and (max-device-width: 1024px) {
.mediumScreenDisabled { display:none }
}
@media screen and (max-device-width: 568px) {
.smallScreenDisabled { display:none }
}
@media screen and (min-width: 1024px) {
.mobilepreview .mediumScreenDisabled { display:block }
.mobilepreview .smallScreenDisabled { display:block }
}
@media screen and (max-width: 1024px) {
.mobilepreview .mediumScreenDisabled { display:none }
}
@media screen and (max-width: 568px) {
.mobilepreview .smallScreenDisabled { display:none }
}