I made a row disappear with CSS, remove the CSS, No More Row

Beaver Builder
1

Hi,

A client wanted to hide a few rows, launch the website, and come back to finish editing those rows before making them visible again.

So I used the following CSS:

 /* .invisible {
  display: block;
  display: none;
  padding: 0px 0px 0px 0px !important;
  margin: 0px 0px 0px 0px !important;
}
*/

Which worked beautifully to make the row to which teh class invisible was applied to, disappear!

Except, it hides it from the Builder as well. So I went and commented out the CSS in the customizer, thinking the row would re-appear. Nope.

The row is there in the code (With the class “invisible”) and now takes up the original space, but nothing shows.

I’ve gone in and deleted the plugin cache, no difference.

Help :slight_smile:

2

[Content Hidden]

3

Hey Gerard,

That’s actually caused by bootstrap’s CSS. All invisible classes are set to visibility: hidden; and that’s what’s causing the problem. I would suggest using the CSS snippet below to show the rows, then either remove the invisible class or change it to something more unique, and remove the CSS snippet afterwards so as not to mess with bootstrap’s CSS.

.invisible {
  visibility: visible !important;
}

Ben

4

Worked like a charm, thanks

Yes, I’ll use a new class like banana to be sure to not mess with Bootstrap’s classes again :slight_smile:

5

Awesome! Have fun with The Beaver! :slight_smile:

Ben