I am trying to set the className of a div using:

  render() {

    const textStyle = {
      position: "absolute",
      top: "200px",
      left: "200px"
    }

    return (
      <Layout>
        <div>
          <div>
            <div className={textStyle}> My text is Test</div>
          </div>
        </div>
      </Layout>
    )
  }
}

However when I inspect all I get is

<div class="[object Object]"> My text is Test</div>

I'm not sure why this is not working.

I can use Bulma modifiers OK

1 Answers

2
Roy.B On Best Solutions

className receives a string, not an object

if you want to use your textStyle object use this:

<div style={textStyle}> My text is Test</div>

more about className: https://reactjs.org/docs/faq-styling.html