react jsx style with calc
If you need some more specific CSS you need to put it into quotes - react inline styles doc
<div style={{width: 'calc(100% - 276px)'}}></div>
In your exact case
customFormat = 'hello-div'
divStyle = {width: 'calc(100% - 276px)'}
return (
<div className={customFormat} style={divStyle}>
Hello World
</div>
)
In case you need to overwrite multiple widths (fallbacks) for browser compatibility
divStyle = {width: 'calc(100% - 276px)',
fallbacks: [
{ width: '-moz-calc(100% - 276px)' },
{ width: '-webkit-calc(100% - 276px)' },
{ width: '-o-calc(100% - 276px)' }
]}