"*" is not a pure selector. How to add styles globally?

0

Issue

I’m using Nextron. I ran my code successfully but when I opened the window, the body tag had a margin of 8px. I opened up the dev tools and changed it successfully but how do I change in my code? If I try to add it any of the module.css file it gives me an error. If I try to make a global.css file it ignores it. How should I configure the window with global styles?

_app.js :

export default function MyApp({ Component, pageProps }) {
    return <Component {...pageProps} />
}

global.css:

* {
  margin: 0;
  padding: 0;
}
html,
body {
  font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica",
    "Arial", sans-serif;
  padding: 20px 20px 60px;
  max-width: 680px;
  margin: 0;
}
a {
  color: inherit;
}

Solution

You can use reset.css or normalize.css to get rid of default styles. You can find install instructions on those pages.

As for your import issue, I doubt that anyone could help with the details you’ve provided. You can update your answer with your styles structure.

Answered By – flppv

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave A Reply

Your email address will not be published.

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More