Jump to content

Aligner blocs horizontalement


Recommended Posts

Bonjour à vous,

Je suis sous Presta 1.6 et je rencontre un problème de mise en place sur la section Home.

j'ai 3 blocs : twitter widget free, bloc cms info client et facebook box free que je n'arrive pas a placer horizontalement les uns à coté des autres. Les deux modules twitter et facebook sont téléchargés depuis http://mypresta.eu, le cms info client est celui par défaut du thème bootstrap.

A part pour le cms, je n'ai rien trouvé en css qui pourrait m'aider a positionner mes blocs. Sous firebug tout pointe vers des liens http twitter ou facebook.

Le seul code qui pourrait correspondre au placement de ces 2 widgets est dans leur .tpl respectif sous forme de div et d'iframe. Seulement voila, je réussi bien a déplacer mes blocs à coup de margin-top et autres paramètres du genre, donc en forçant leur placement, mais le responsive n'y ai plus. Les 3 blocs se chevauchent au format tablette. De plus, plein écran sous firefox c'est propre mais sous chrome les 3 blocs horizontaux se place n'importe ou. Donc cette solution n'est pas bonne. Vous l'aurez deviné, je ne suis pas non plus une brute en web development ;)

Ma question est que dois-je donc écrire comme code pour que ces 3 blocs se positionnent à la suite les uns des autres de manière horizontale et sans perturber le responsive. ?

Ou, faut-il que je crée un hook pour chaque module ?

 

image01.jpg - ce que j'ai actuellement.

image02.jpg - ce que je voudrais faire.

 

Merci pour votre aide

Bertrand

post-893290-0-96677600-1421113886_thumb.jpg

post-893290-0-49583100-1421113919_thumb.jpg

Edited by zblteam (see edit history)
Link to comment
Share on other sites

  • 2 years later...

bonjour, il faut comprendre le système de grille de bootstrap, avec une url ce serait plus simple de vous aider....

 

Bonjour,

 

C'est loin d'être facile. :mellow:

 

Car dans le cas présent :

 

1 bloc affiché = 1 module

 

Que ce module s'appelle "chèque" et "bidule" ; réussir un alignement côte à côte c'est hard.

 

Il existe des tutos sur le css, et même des générateurs : http://www.responsivegridsystem.com/calculator/

 

Choisir l'option : 2 colonnes, margin : 1.6%

 

Transposer le code donné en language clair dans prestashop.

 

Bon courage.

 

Cordialement.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...