Code by Day | Explore By Weekend

How To Make The Text Style Options Sticky Within The Divi Builder Module Text Areas Tutorial by Pee Aye Creative

How To Make The Text Style Options Sticky Within The Divi Builder Module Text Areas

In this tutorial you will learn how to make the Divi text style settings sticky when you scroll within any Divi Builder module text area.

Make All Divi Text Style Settings Sticky

This solution will apply to any module that has the text content area, such as the Text module, Blurb module, Person module, Testimonial module, etc. This works when the “Visual” tab is selected, and is great when styling text, adding links, making blockquotes, etc.

sticky Divi settings GIF min

I have a very simple CSS snippet that targets just the right items within the Divi Builder and makes it sticky when you scroll. It took me quite a long time to figure out which CSS selector to use, so I hope you appreciate it 🙂

If you are using our free Divi child theme, place this snippet into the style.css file. Otherwise, place this in your Divi>Theme Options>Custom CSS code box. If you need help, check out our complete guide on Where To Add Custom Code In Divi.

/*make Divi Builder text style settings sticky on scroll*/

.mce-panel .mce-stack-layout-item.mce-first {
	position: sticky!important;
	top: -60px;
}

Be sure to watch the video to see the sticky effect demonstrated in a variety of different modules. If you think this is worth using on your websites, please let me know in the comments!

26
Last updated Apr 20, 2021 @ 3:59 am

Please share this post!

Nelson Lee Miller (aka The Divi Teacher)

Nelson is the owner of Pee-Aye Creative Co in the beautiful state of Pennsylvania. He loves helping small businesses, exploring, building websites with Divi, and teaching others.
Divi Adventure Club Product And Course Membership by Pee Aye Creative

Become A Member!

Gain access to everything we offer!

Learn More

Leave A Response!

Subscribe
Notify of
guest
7 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Mark Hancock
Mark Hancock
18 days ago

A gem of a divihack. Thank you for this practical snipplet!

Patrick Hedgepath
Patrick Hedgepath
18 days ago

Thanks for this! Has been frustrating me for a long time. Never thought to look into a CSS solution for it. *smacks forehead*

Jacob
11 days ago

This is definitely something Elegant Themes should add natively to Divi. Very useful.

Francis Malabanan
Francis Malabanan
10 days ago

Good Job! This worked for me for a short time and for some reason it is not sticking anymore, it was back to how it was. Not sure if I did something different.

Asset 7

Shop Our Divi Products

Plugins • Courses • Templates

Visit The Shop

Divi Adventure Club Product And Course Membership by Pee Aye Creative

Become A Member!

Gain access to everything we offer!

Learn More

Divi Tutorials On YouTube

Join over 5,900 others and subscribe to our helpful Divi videos!

Visit Our Channel

Recent Posts

Pin It on Pinterest

0

Your Cart