Forum Documentation Showcase Pricing Learn more

How to set height of HTML element to initial content? [HTML CKEDITOR Plugin]


#1

Hey everyone, I’ve reached out to the publisher of this plugin: https://bubble.is/plugin/html-ckeditor-1544435578575x943111953013014500 with no response, so I’m wondering if someone savvy in CSS styling can help me with a workaround.

This HTML CKEDITOR element has been pretty handy for offering an HTML input. I’m working with an app that uses it to allow users to compose HTML email content. The app pre-fills the input with template copy, and this works just great, however, the various templates can be quite lengthy and we’d like a way to auto-size the height of this editor element to fit the initial content. It has to be dynamic because there are multiple templates and we’d like for the default height to be relatively short (unless forced taller by the initial content).

The CSS will need to specifically identify this element, but I need some help with the code. Anyone have ideas?

Here’s a test page:

And editor:

The input has some long initial content. When you preview, you’ll see the element doesn’t “stretch to fit.” Would love a solution for this. Better yet, if the plugin developer is reading, perhaps build in this functionality!

Thanks!


#2

Something what I tried and worked. I placed the CKEditor inside a group and made that group height 250 and set the height of the ckeditor to be 900. This way it allows to be stretched manually. It can also be done by not using the group but then the ckeditor takes up all of the editing space.

If you want it automatically you need to adjust the plugin yourself.


#3

Thanks for the suggestion! Yeah, I’m looking for it to happen automatically. Hopefully the plugin developer can get back to me soon.