Dans cet article, on va voir ensemble comment on peut créer un séparateur vertical entre deux colonnes, on fera ça toujours avec la version gratuite d’Elementor. Vous êtes prêt(e)? C’est parti !

Alors l’idée, c’est qu’il faut d’abord aller sélectionner notre colonne. Faire ici, sélectionner ma colonne

et je vais aller dans Style. Et dans Style,

j’ai quelque chose qui s’appelle bordure. Donc une fois que c’est sélectionné, je vais tout simplement demander à avoir un type de bordure continue. Si dans largeur, je mets une valeur, quelle qu’elle soit, par exemple je vais mettre quelque chose assez extrême, bien sûr. Je vais mettre 10. Là, ça ne va pas puisque évidemment, il va falloir que ma bordure soit uniquement à droite.

Donc, petite astuce, on va mettre 0 pour commencer. On va cliquer ici sur la petite chaîne à droite de largeur pour que ça ne soit plus chaîné (c’est à dire qu’en modifiant une valeur, cela ne les modifie pas toutes). Et là, cette fois-ci en mettant tout à zéro, on va juste demander dans largeur que ça soit à droite et on va donc mettre par exemple 7 à droite (les autres chiffres restent à zéro comme on a cliqué sur la petite chaîne).

Evidemment si je veux aussi changer la couleur du séparateur de colonne, c’est tout à fait possible. Si, par exemple, je veux passer en rouge ou en noir, il suffit d’aller dans couleur et de sélectionner celle souhaitée.

Et si je veux mettre un petit peu plus d’espace pour pas que le texte de ma colonne de droite soit trop collé au séparateur de colonne, je vais aller sur ma colonne de droite et ensuite je vais dans Avancé. Et là j’enlève les marges puisque je veux juste modifier celle de gauche et je vais rajouter une marge interne à gauche après avoir cliqué sur la petite chaîne pour ne modifier que la valeur de la marge interne gauche. Ainsi ce sera moins collé à ma bordure.

Voilà ce que je peux vous dire pour cette astuce concernant l’ajout d’une bordure sur deux colonnes pour une séparation verticale entre deux colonnes sur Elementor.

A très bientôt pour une prochaine astuce !.

A lire également

Débuter avec Elementor

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *