Startseitenfeature

Ich versuche, dieses als einzelnes hervorgehobenes Thema auf Desktop und Mobilgerät anzulegen.

Das CSS ist dafür eigentlich nicht ausgelegt, aber ich habe es geschafft, es mit folgendem Code zu hacken, sodass das Bild schön über die volle Breite angezeigt wird:

.featured-topic-wrapper .featured-topics .featured-topic {
    max-width: none !important; 
    .featured-topic-image {
    max-width: 800px !important; 
    width: 100%;
    }
}

Allerdings ist es dadurch nicht sehr reaktionsfähig bei Bildschirmgrößenänderungen oder auf Mobilgeräten, wodurch das Seitenverhältnis verloren geht (was ich wirklich beibehalten möchte). Ich habe das umgangen, indem ich eine passende Bildgröße gewählt und eine andere Höhe fest kodiert habe.

Gibt es eine einfache Änderung, die ich vornehmen kann, um es responsive zu machen? Und ist es auch sinnvoll, die CSS des Components anzupassen, um besser auf den Anwendungsfall eines einzelnen hervorgehobenen Themas einzugehen?

3 „Gefällt mir“