Remove default margins/padding from react app

[milevicm]

I created some simple react app using UXP, but I got some default margins around body. Is it possible to remove these predefined margins?

``` style.css
*{
  padding: 0;
  margin: 0;
}
.body{
  background-color: red;
  width: 100%;
  height: 100%;
}

import "./style.css"
const App = () => {
  return ( 
    <>
    <div className="body">
      test
    </div>
    </>
  )
}

export default App;

[DavideBarranca]

It’s very likely that you have some padding set for the ReactDOM.render() call. It really depends on the way your project is structured, so it can be in main.js or elsewhere.

To give you an example, if you use the React Starter template in the UXP Developer Tool, look in PanelController.jsx around line 30:

        this[_root] = document.createElement("div");
        this[_root].style.height = "100vh";
        this[_root].style.overflow = "auto";
        this[_root].style.padding = "8px";

        ReactDOM.render(this[_Component]({panel: this}), this[_root]);

        return this[_root];
    }

HTH.

[milevicm]

Thanks @DavideBarranca
Great and useful answer as are yours books and everything you do for young developers