Retour à la ligne du titre sur affichage responsive

  • Posts: 39
  • Thank you received: 0
  • Hikashop Business
2 weeks 6 days ago #307341

-- HikaShop version -- : 4.1.0
-- Joomla version -- : 3.9.6
-- PHP version -- : 7.1.26

Bonjour,

Je ne parviens pas à corriger un problème d'affichage responsive. Je perd le colonage et les titres des produits force la largeur des blocs.

This message contains confidential information


Pourriez-vous m'aider à résoudre ce problème ?

Merci par avance.

Bonne journée,

Pierre

Please Log in or Create an account to join the conversation.

  • Posts: 66049
  • Thank you received: 9670
  • MODERATOR
2 weeks 6 days ago #307344

Bonjour,

C'est le principe du "responsive" pour les layouts de type "grid" de passer sur une colonne pour les petites résolutions.
Donc ce que je vois dans votre vidéo est le fonctionnement normal.
Faites la même manipulation sur demo.hikashop.com/index.php/en/hikashop/...sting/display-in-div et vous verrez que l'affichage passe aussi en 1 colonne sur les petites résolutions.
Si vous ne voulez pas cela, alors il va falloir modifier le CSS pour enlever le responsive...

Please Log in or Create an account to join the conversation.

  • Posts: 39
  • Thank you received: 0
  • Hikashop Business
2 weeks 5 days ago #307396

Bonjour,

Merci de votre réponse.

L'idée était de passer progressivement de 4 puis 3 puis 2 puis 1 colonne, mais ce n'est pas un point prioritaire.

J'aimerai par contre résoudre mon problème d'affichage de titre lorsque la liste des produits est sur une seule colonne.
Le titre force la largeur de la vignette. Je souhaiterais qu'il passe à la ligne pour avoir quelque chose d'uniforme, mais je n'y parviens pas.

Merci par avance de votre aide.

Bonne journée,

Pierre

Please Log in or Create an account to join the conversation.

  • Posts: 66049
  • Thank you received: 9670
  • MODERATOR
2 weeks 5 days ago #307403

Bonjour,

La largeur de la vignette et le nombre de retours à la ligne du produit ne sont qu'indirectement liés.
Vous pouvez très bien limiter la largeur disponible pour le titre ou rajouter des retours à la ligne sans forcément changer la largeur de la vignette.
Par exemple, en rajoutant ce CSS sur votre site:
.hikashop_product_name a {
width: 200px;
margin: auto;
}
monosnap.com/file/WAex5vzn82OAl233DjWZ5Up1q6fM9C
Et avec un peu de CSS pour être sur 2 colonnes:
monosnap.com/file/sVznUwMsHpj98lGNufDeWxaCLXpVQi
Après, il faut rajouter ce second CSS avec un tag @media pour ne le rajouter que sur les petites résolutions et ainsi garder les 4 colonnes sur les grosses résolutions.
www.emailonacid.com/blog/article/email-d...width_and_max-width/

Please Log in or Create an account to join the conversation.

Time to create page: 0.060 seconds
Powered by Kunena Forum