Categories: Trucs et astuces

Ajouter des styles aux séparateurs de sections sur Divi

Trouvé sur http://gritty-social.com/arrow-section-dividers-for-the-divi-theme/, Stephen nous propose un code à ajouter à vos styles CSS afin de créer des séparateurs de section en forme de flèche (+ un autre en forme plus arrondie).

.arrow-section:after {
content: '';
display: block;
position: absolute;
width: 60px;
height: 60px;
background-color: #303030;
bottom: -30px;
left: calc(50% - 30px);
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
z-index: 1;
}

Pour une forme arrondie, vous jouterez « border-radius: 50%; ».
Pour faire remonter la flèche au lieu de la proposer tête en bas, remplacer simplement « bottom:-30px; » par « top:-30px; »

Christophe

Share
Published by
Christophe

Recent Posts

Articles manquants dans la recherche Prestashop

Si certains de vos articles ne sont pas présents lors d'une recherche avec Prestashop, c'est…

8 ans ago

Ajouter un texte sur les images d’une galerie Divi + lien

Trouvé sur https://divisoup.com/how-to-add-links-to-the-divi-gallery-module-and-show-captions-on-hover/ comment ajouter un lien et une description sur les images d'une galerie…

8 ans ago

Proposer les résumés d’articles en quinconce – Divi

Trouvé sur Divi Soup http://divisoup.com/how-to-create-a-fullwidth-alternating-blog-layout/ le tuto propose de créer une page pleine largeur avec…

8 ans ago

Ajouter un bouton fixe sur le côté de son site

Trouvé sur http://divisoup.com/how-to-create-a-sticky-button-in-divi/ comment ajouter un sticky button (bouton fixe) sur le côté de son…

8 ans ago

Ajouter les Google Structured Data sur son site Divi

http://ahmedkaludi.com/structured-data-divi-theme/ Ahmed Kaludi nous offre un modèle de Child Theme avec les Structured Date de…

8 ans ago

Trouver un slider pour ses projets web

Un slider qui semble bien fonctionner en ce moment : Slick. A tester, plugin WP…

8 ans ago