CODEWITHSUNDEEP
reactjs
Tips and Tricks Of Chess
Tips and Tricks Of Chess

Reputation: 55

syntax of styling a react component in react.js

<div className="card border-0 shadow " style={{margin: '0 500px' }}>

The above code describes how to add margins to a component ,but why can't it be written like this:

<div className="card border-0 shadow " style={{top-margin: '500px';left-margin : '200px' }}>

Upvotes: 0

Views: 323

Answers (3)

Usamah Basalamah
Usamah Basalamah

Reputation: 9

you have to write it like this

<div className="card border-0 shadow " style={{marginTo: '500px';left-margin : '200px' }}>

Upvotes: 0

Abdulrahman Ali
Abdulrahman Ali

Reputation: 625

Because you're writing in JSX syntax which means you need to pass an object to the style attribute/prop. These object keys need to be in camelCase notation. You can use CSS classes and add them in the className name attribute as well or just use styled-components.

Upvotes: 0

TadejP
TadejP

Reputation: 48

Your style syntax is wrong, replace ; with , to make it a valid object. Also object keys should be in camelCase.

Example:

style={{ marginTop: '500px', marginLeft: '200px' }}

Upvotes: 1

Related Questions