EvilEddie
EvilEddie

Reputation: 1035

Add list-style-type to react inline style

I am trying to add a style to a list in React:

const listStyle = {
  list-style-type: none,   // Error
};

and then:

const Box = () => (
   <ul style={listStyle}>
     <li>one</li>
     <li>two</li>
   </ul> 
);

But I get an unexpected token error. Is list-style-type not supported?

Even doing it inline gives an error:

<ul >
  <li style={{list-style-type: "none"}}>One</li>
  <li style={{color: "red"}}><Checkbox />Two</li>     
</ul>

Upvotes: 21

Views: 39942

Answers (1)

Sergii Rudenko
Sergii Rudenko

Reputation: 2684

Your problem is with name of the style properties, it should be in the camel case format:

<li style={{ listStyleType: "none" }}>One</li>

Documentation on inline styling in react is here.

Upvotes: 35

Related Questions