How to write inline styles in react

Question

whats wrong with this line? var firstColStyle = {text-align: right};

This works: var firstColStyle = {width: 70};

Seems to be a odd syntax for styles?? The documentation about this issues is very poor. How to make elements reactive, so I can't use 20% instead of 300px.

With best regards

Gerhard

Answer 1

Change firstColStyle to:

var firstColStyle = { textAlign: 'right' }

If you have to set px you can:

var someSize = { width : '2px' }

If percentage:

var otherWidth = { width : ' 10%' }