Default font size for all text in react-native-render-html

Question

Is there a way to force all text that gets rendered in any element to have a default font size?

I am displaying HTML from a web editor and don't have control over how the HTML is rendered. For instance, the text can be in a div, span, or nested inside a span and a b tag.

<div>
    <div>text in div</div>
    <span>text in span</span>
    <span><b>text in bold</b></span>
</div>

I know you can use renders like this, but I cannot do this with all divs.

const renderers = {
  h1: (html, children, styles, {key}) => <Text key={key} style={styles.h1}>{children}</Text>,
};

<HTML
  html={html}
  renderers={renderers}
/>

Jatin Bhuva · Accepted Answer · 2024-02-15 06:21:44Z

2

Try the below solution:

const defaultTextProps = {
   style: {
    fontSize: 16, // Your default font size
   },
 };


<HTML
   html={htmlContent}
   defaultTextProps={defaultTextProps} //Apply default styles to all text elements
/>

answered Feb 15, 2024 at 6:21

Jatin Bhuva

1,9361 gold badge7 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Default font size for all text in react-native-render-html

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related