Hallo Community, wenn ich das Layout versuche responsive zu gestalten und für eine Klasse (class) “@media screen and (min-width: @desktopViewportWidth)” vorselektiere, heißt dass dann, dass dieses Element NUR auf einem Destop Bildschrim erscheint und auf allen anderen Displays nicht??? Stehe gerade vor dem Problem das zu reproduzieren mit “Resizer”, damit funktioniert es aber nicht, wird immer angezeigt, egal welches Display. Danke und Gruß Frank
Hi, ich habe im Footer noch Text untergebracht, der auf Smartphone nicht angezeigt wird. Desktop und Tablets ja. Frag mich nicht, mein Sohn hat es so gemacht. Beispiel: @media screen and (min-width: @tabletViewportWidth) { .footer-main .x-footer–column { width: 50%; } .footer-main .x-footer–columns { display: block; } }
Um Deine ursprüngliche Frage nochmal aufzugreifen: Ja, “@media screen and (min-width: @desktopViewportWidth)” hilft dabei, dass dieses Element erst ab einem Desktopbildschirm angezeigt wird, sofern es dann anschließend mit der CSS-Anweisung “display: none;” versehen wird. Gruß
ab 78.75em bzw. 1260px
Das hat nichts damit zu tun, ob es das Element „angezeigt wird oder nicht“, das hängt von Deinem CSS ab. Es definiert lediglich, wann diese CSS-Definition der Class greift. Bsp: .myclass {background:green;} @media screen and (min-width: @desktopViewportWidth) .myclass {background:red;} Ist die Hintergrundfarbe bei < Desktop grün und AB Desktop rot. Damit es also NUR im Desktop angezeigt wird, müsstest Du die classe z.B. allgemein auf „display:none“ setzen, und nur für ab Desktop den RICHTIGEN Typ setzen - dass MUSS nicht zwangsweise „block“ sein (display:initial für den Defaultwert)
Ok, vielen Dank für eure Hilfe, hab’s verstanden! Gruß