Rich Text Editor Component in Properties is overlaying over other properties

Francis Carroll asked on April 1, 2022 10:57

Hi,

I am running ASP .NET CORE application with Kentico 13 on a IIS 10 Server.

I am having an issue with the rich text editor in the properties of a widget i am developing. The field that has the RichTextEditorComponent identifier overlays the "Field is empty, Edit" over all the other fields.

Image Text

As you can see from the image above the 'Text' field is overlaying over the other fields. Any help is appreciated.

[EditingComponent(RichTextComponent.IDENTIFIER, Order = 1, Label = "Text")]
public string Text { get; set; }

asp core mvc iis 10 kentico 13 rich text editor

Correct Answer

Francis Carroll answered on May 25, 2022 10:12

This was an issue with the way the project installed, hotfixing the project fixed this issue.

0 votesVote for this answer Unmark Correct answer

Recent Answers

Dmitry Bastron answered on April 6, 2022 06:56

Hi Francis,

What Hotfix version are you using? Did you try to update to the latest hotfix? Perhaps this could solve your issue.

Also, please check in the inspect menu of your browser that it is not caused by your custome CSS styles.

0 votesVote for this answer Mark as a Correct answer

Francis Carroll answered on April 6, 2022 09:51

Hi,

I am on Version 13.0.31 of Kentico. I have another project running this exact same hotfix and it doesnt have this issue.

I have also inspected the element and the only script that appears to be affecting it is page-builder.css which is a kentico script.

0 votesVote for this answer Mark as a Correct answer

Dmitry Bastron answered on April 6, 2022 10:23

Can you compare the content of page-builder.css between your current and another projects? Are there any differences? Also, is this issue reproducable across all page builder pages or maybe it is related to a specific place? E.g. did you try a fully empty page with only this widget on it?

0 votesVote for this answer Mark as a Correct answer

Francis Carroll answered on April 6, 2022 10:46

Hi,

This issue is reproducible across all pages, even a new page without anything else on it.

I compared the page-builder.css and on the html field

   <iframe class="ktc-form-control ktc preview-frame" srcdoc="froala_editor code">

The height on this field is overwritten by the builder.css, on the site that is working but it is not overwritten in the css on the broken one and height remains at 32px instead of 144 as defined in builder.css.

Im unsure as to how this is occurring or how to resolve it.

0 votesVote for this answer Mark as a Correct answer

Francis Carroll answered on April 6, 2022 10:57

Upon further inspection the issue is caused by the builder.css file in the working project it contains height: 144px!important whereas in the broken project it contains height: 144px

0 votesVote for this answer Mark as a Correct answer

Dmitry Bastron answered on April 6, 2022 11:07

It can be related to Froala plugin version. Is it possible that on your current instance it was 13.0.0 originally, then you installed 13.0.31 Hotfix but it didn't update the editor somehow?

0 votesVote for this answer Mark as a Correct answer