Soucis de ratio des images d'une boutique intégrée

Bonjour à tous, je monte un site (en joomla et responsive évidemment) pour un ami Youtuber. Nous avons intégré une boutique spreadshirt (http://jivay.tica.fr/index.php/boutique#!/) pour y mettre les qq designs de sa chaine (d’ailleurs à quand les designs sur chopes de bière et stickers ? ^^)

J’ai à l’heure actuelle deux soucis que je n’arrive pas à régler quand je baisse la taille de l’écran (en mode tablette et mobile).

  1. Le bandeau “promotion” vient se caler au dessus du menu ce qui rend “homme, femme…” inacessible !.. c’est d’ailleurs le cas sur tous les sites que j’ai pu visiter.

  2. Pour je ne sais quelle raison, n’ayant pas spécialement surchargé en css (en tout cas rien d’extravagant), à certaines tailles d’écran, le ratio hauteur/largeur ne fonctionne plus… mes images gardent leur hauteur (qui est pourtant en height:auto) et se déforme dans la largeur.

Pour info, je n’ai pas surchargé les css natifs de spread (sauf pour enlever certaines zones à base de display:none) et je constate que mon soucis 2 n’existe ni sur la marketplace, ni sur une boutique non intégrée à un site.

Si jamais qq’1 à déjà vu çà, je suis preneur !

Force et houblon

À l’attention de ceux qui utilisent Joomla (et Template Creator), j’ai réglé mon soucis de ratio en allant dans extensions>templates>dossier CSS>mobile.css

là, par défaut vous avez :

@media screen and (min-width: 950px) and (max-width: 1024px) {
img {
max-width: 100% !important;
height: auto !important;
}

vous modifiez en “height: 100% !important;” et ce pour toutes les tailles (4 ou 5 occurrences).

En espérant que cela aidera un jour^^

1 Like

Merci @Tilcara d’avoir partagé ta solution! Je suis certaine que cela aidera plusieurs personnes :slight_smile: Bon weekend!

1 Like