Using style="" in React/Bootstrap makes page blank

Question

Code

import React from "react";
import 'bootstrap/dist/css/bootstrap.css';
const Downloads = () => {
  return (
    <div class="text-bg-secondary text-white p-2">
        <div class="card">
  <div class="card-body">
    <h5 class="card-title">Card title</h5>
    <h6 class="card-subtitle mb-2 text-muted">Card subtitle</h6>
    <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
    <a href="#" class="card-link">Card link</a>
    <a href="#" class="card-link">Another link</a>
  </div>
</div>
    </div>
  );
};
  
export default Downloads;

In the Code above, it works as long as i don't add style= , the same happens everytime i add it anywhere. for example

<div> 

works but

<div style=""> 

does not.

I tried reinstalling bootstrap. Expected: Should Show page with its contents.

Answer 1

Try writing your style like this :

style={{color: "red", border: "2px solid red"}} // for example

And your class= must be className=

With React, you can't write attribute as in HTML