horizontal scroll appears

[eladgel]

I've set the richtexteditor style to be ={{width:'100%',height:400}} and I see the horizontal scrollbar I can also change the width: to 200 and it will act the same only on a shorter width how can i fix this?

[Joyep]

It also appear on Android, does anybody help to fix this problem?

[prerakd]

Above mentioned issue is due to default css applied. One can provide customCss as a prop to override default css. More specifically, the issue is due to following css attribute: #zss_editor_content { padding-left: 10px; padding-right: 10px; } overriding it by #zss_editor_content { padding-left: 0; padding-right: 0; } will fix the issue.

[skizzo]

Strange. For me, this doesn't do the trick - I still have a horizontal scroll bar appearing since the padding doesn't seem to apply on react-native 0.57.8 and react-native-zss-rich-text-editor 1.1.0:

<RichTextEditor
  ref={r => this.richtext = r}
  initialTitleHTML={'<div style="font-family: Raleway-Bold; color="black">My title</div>'}
  initialContentHTML={'<div style="font-family: Raleway-Regular;">Here are some introductional words for <b>My title</b>.<p>This is a new paragraph.</p><p>This is another new paragraph</p></div>'}
  customCss={`#zss_editor_content { padding-left: 0; padding-right: 0; }`}
  />

What am I doing wrong here? Thanks

[sergiulucaci]

@skizzo change customCss to customCSS, so will be something like:

<RichTextEditor
  // other props
  customCSS={`#zss_editor_content { padding-left: 0; padding-right: 0; }`}
/>

source