How to Move or Hide the Divi Text Style Popover

In this post, I'm going to give you two CSS snippets to move or completely hide that annoying gray text style popover when editing text in Divi.

Option 1: Hide It Completely

If you never want to see this thing again, use this option. 

To use this, copy the code and go to Dashboard>Divi>Theme Options>Custom CSS and paste the code there. The text style popup thingy will then be hidden as you work on all your pages.

/*hide Divi Builder text style popover*/

.et-db #et-boc .et-fb-popover–inverse.et-fb-popover–arrow {
display: none;
}

Option 2: Move It Farther Away

If you want to keep the text style popover around, but want to get it out of the way farther so you can actually type, use this method. 

Once again, to use you will need to copy the code and go to Dashboard>Divi>Theme Options>Custom CSS and paste the code there. The text style popup will now move up 100px from where you are typing.

/*move the Divi Builder text style popover farther away*/

.et-fb-popover–inverse.et-fb-popover–elevate {
margin-top:-100px !important;
left: 50%!important;
}

5

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.

Join Our NEW Divi Facebook Group!

The Divi Teacher Logo

Recent Posts

Leave A Response!

Subscribe
Notify of
guest
4 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Jacobus
Jacobus
1 year ago

Awesome fix! Thanks

Fred
Fred
1 year ago

Perfect!

Shop Our Divi Products!

Child Themes • Plugins • Layouts

Visit The Shop

Divi Tutorials On YouTube

Subscribe to our helpful Divi videos!

Visit Our Channel

0
Would love your thoughts, please comment.x
()
x

Pin It on Pinterest

0

Your Cart