score:4

Accepted answer

Can you try importing Bootstrap from within your creative.css file? I think that will allow Webpack to get the order right, whereas when using import in JS to import CSS it doesn't define any strict order.

E.g.

index.js

import './css/creative.css'

creative.css

@import url('./bootstrap.css');
...your custom css...

score:-2

You can override bootstrap.css with creative.css using following step.

Step 1. Set root id<body id="bootstrap-overrides">

Step 2. Do following changes in creative.css. You just need to set prefix to any CSS selector with your Id ("bootstrap-overrides") like below.

#bootstrap-overrides h1 
{
  margin-top: 10px;
  margin-bottom: 0.5rem;
}

Hope it will resolved your issue. Please try it.


Related Query

More Query from same tag