Bug Affichage colonne dans mes pages

[Tommy31]

Bonjour,

J'ai voulu modifier la largeur de mes colonnes sur mon site vu que je n'utilisais pas la navigation a facette. Jusque la tout va bien mais quand j'ai commencer a naviguer sur mon site je me suis rendu compte la mise en page de certaines pages n'allaient plus du tout.

J'ai essayer de trafique avec les colonnes en passant de md3 à md4 mais pas de grand résultat. 

Exemple de pages qui bug : https://cbdprofrance.fr/nous-contacter

Auriez vous une solution à m'apporter ? 

Merci d'avance

 

[Eolia]

Ne bidouillez pas votre thème et utilisez les options du thème (affichage des colonnes droite/gauche)

[Tommy31]

J'ai reussi à repasser ma page avec les deux colonnes mais mtn la presentation sur la page est cassé : 

Auriez vous une solution, il me semble avoir enlever toutes les modifications que j'avais apporter mais aucun résultat

C joint mon fichier contactform.tpl

 

contactform.tpl

Edited August 5, 2023 by Tommy31 (see edit history)

[lionsteph]

Bonjour,

Enlever pour commencer les "float" qui ont été ajoutés aux classes .col-md-x dans le css. "Float" est à bannir car ça crée + de problèmes que ça n'en résout.

Ensuite pour la taille et disposition des colonnes, il faut toujours dans un élément "row" que le total des ".col-md-x" fasse 12. Par exemple si j'ai bien compris ce que vous vouliez faire (2 colonnes égales), il faudrait dans chaque "row" avoir deux colonnes avec la classe "col-md-6"

Et à la place du "float:left", essayez plutôt "display: inline-block;"

 

[Mediacom87]

il y a 18 minutes, lionsteph a dit :

Bonjour,

Enlever pour commencer les "float" qui ont été ajoutés aux classes .col-md-x dans le css. "Float" est à bannir car ça crée + de problèmes que ça n'en résout.

Ensuite pour la taille et disposition des colonnes, il faut toujours dans un élément "row" que le total des ".col-md-x" fasse 12. Par exemple si j'ai bien compris ce que vous vouliez faire (2 colonnes égales), il faudrait dans chaque "row" avoir deux colonnes avec la classe "col-md-6"

Et à la place du "float:left", essayez plutôt "display: inline-block;"

 

Rappelons qu'il existe une documentation bien faite sur le sujet directement sur le site de bootstrap https://getbootstrap.com/docs/3.3/css/#grid