I'm new to React and currently in the process of building a website, however I cannot get rid of the margin of the body. My css in inside the index.js component and looks like this:
<style jsx>{`
body {
margin: 0px;
padding: 0px;
}
`}</style>
You should use global with jsx style
<div>
<style jsx global>{`
body {
margin: 0px;
padding: 0px;
}
`}</style>
</div>
Where is your root
defined? If it's within the body, you won't have access to the body element. Add it to your css or as an in-line style in your index.html.
Inline index.html
<body style="margin: 0px; padding: 0px;">
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
</body>
CSS
body {
margin: 0px;
padding: 0px;
}
You can simply create a global.css
if not already added with css style:
html,
body {
paddding: 0;
margin: 0;
}
and import this styles inside _app.jsx
:
import "./global.css";
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With