Selecting a hidden html element when...
Ran across another funky bit today.
I'm placing an HTML element inline then using jQuery to create an inline pop up.
That HTML uses a display:none style written into it's division, then the mistake I made was set the min-height to 0 so it wouldn't effect layout. I found if you do that there is no way to select it with RSD any longer, the drop down menu or main menu does not include a selector for the HTML element! It'll just disappear on you.
FIX & OPTIONS
So if you did that you are going to need to use control + z or EDIT / UNDO to get back to the element, (if you can).
Option 1 then if you keep the display:none style written inline you'll need to set that element to a min-height of 2px in DESIGN / DIMENSIONS to be able to edit it in the future. That way you can keep the div hidden but be able to select it.
Or option 2 is to use RSD to place the display:none inside a surrounding division tag and paste your HTML in that, then got to the layout menu and select the "show hidden items checkbox" and go back and forth between that and the HTML elements under the DESIGN menu until your edits are done.
Bottom line, don't set an HTML element to min-height of 0.
I'm placing an HTML element inline then using jQuery to create an inline pop up.
That HTML uses a display:none style written into it's division, then the mistake I made was set the min-height to 0 so it wouldn't effect layout. I found if you do that there is no way to select it with RSD any longer, the drop down menu or main menu does not include a selector for the HTML element! It'll just disappear on you.
FIX & OPTIONS
So if you did that you are going to need to use control + z or EDIT / UNDO to get back to the element, (if you can).
Option 1 then if you keep the display:none style written inline you'll need to set that element to a min-height of 2px in DESIGN / DIMENSIONS to be able to edit it in the future. That way you can keep the div hidden but be able to select it.
Or option 2 is to use RSD to place the display:none inside a surrounding division tag and paste your HTML in that, then got to the layout menu and select the "show hidden items checkbox" and go back and forth between that and the HTML elements under the DESIGN menu until your edits are done.
Bottom line, don't set an HTML element to min-height of 0.
That is what the Inspector pane is used for. Locate the element you want to work with there and then double-click it and it will take you to the Design pane for that element.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
There in lies the rub Scott, with no selector for the HTML object you can't get to the design pane for it. Unless it's me missing something, or you mean using the RSD display none option to save editing steps.
You can always get to the Design pane from the Inspector pane. Locate the element you want to work with (on the Inspector pane) and then double-click it and it will take you to the Design pane for that element.
Display set to None and a min-height of 0:

Display set to None and a min-height of 0:


Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
I'll give that a shot.
Hey, with min-height 0
You can go to the inspector, locate the HTML element and select it... then hit the DESIGN menu and work on it too.
Thanks Scot, neat trick.
You can go to the inspector, locate the HTML element and select it... then hit the DESIGN menu and work on it too.
Thanks Scot, neat trick.
Alter Eagle wrote:
Hey, with min-height 0
You can go to the inspector, locate the HTML element and select it... then hit the DESIGN menu and work on it too.
Thanks Scot, neat trick.
Hey, with min-height 0
You can go to the inspector, locate the HTML element and select it... then hit the DESIGN menu and work on it too.
Thanks Scot, neat trick.
Exactly! How have you not used that feature yet?

Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
I have been using that to track the HTML and find the CSS, stuff like that.
I didn't know you could use it as a main selector too to get to different menus,
you can barrel around this puppy like a good thing with that little gem.
I didn't know you could use it as a main selector too to get to different menus,
you can barrel around this puppy like a good thing with that little gem.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.