How to Move or Hide the Divi Text Style Popover

20180214122145_IMG_9804_01
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;
}

Problem solved! Send me a virtual hug by sharing this post!

I know this is a widespread issue, so be sure to let your friends know. If you like tips like this, please subscribe because we have tons of tutorials in progress to be posted!

Please share this post!

Nelson Lee Miller

Nelson is the owner of Pee-Aye Creative Co in the beautiful state of Pennsylvania. He loves helping small businesses, exploring, and building websites with Divi.
0

Your Cart