After writing css in Scss file, how to put default css in top position into Compiled css file

Question

Here My Scss code

 *{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
  }
  body {
    font-family: 'Montserrat','Poppins', sans-serif;
    font-size: 1rem;
  }

  .header_area {
    .main_nav {
      .site_logo {
         font-size: 2rem;
      }
    }
  }

And Here my Complied css code. My global css Like *{...} and body{...} Now I want to see my global code in top position into Compiled css file.

  .header_area .main_nav .site_logo {
     font-size: 2rem;
  }

  * {
      padding: 0;
      margin: 0;
      box-sizing: border-box;
    }

    body {
         font-family: "Montserrat", "Poppins", sans-serif;
   }/*# sourceMappingURL=app.css.map */

Answer 1

SCSS is written get first priority. you can easily set your global css top frist split the css and made order format like

@import './header';

@import './main';

@import './footer';

change your file names:_header.scss, _main.scss and _footer.scss and compile that into a css file containing all the scss files in one