Funzionalità Homepage

Sto cercando di far funzionare questa come un singolo argomento in evidenza sia su desktop che su mobile.

Il CSS non è realmente predisposto per questo, ma sono riuscito a modificarlo con questo codice in modo che l’immagine sia visualizzata bene su tutta la larghezza:

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

Tuttavia, non è molto reattivo ai cambiamenti di larghezza dello schermo o al mobile, perdendo il rapporto di aspetto (che mi piacerebbe mantenere). Ho aggirato il problema scegliendo un’immagine di dimensioni appropriate e impostando un’altezza diversa in modo fisso.

C’è un cambiamento semplice che posso fare per renderlo reattivo? Inoltre, vale la pena modificare il CSS di questo componente per adattarlo meglio all’uso di un singolo argomento in evidenza?

3 Mi Piace