css3 - CSS @import inside a class -

i attempting following:

.bootstrap-scope {    @import "bootstrap.min.css"; } 

i know bootstrap.min.css in proper place because placing @import "bootstrap.min.css"; @ top of css page works fine.

anyways, point able scope out affected bootstrap. bootstrap applied enclosing div

<div class="bootstrap-scope"> ... </div> 

any ideas? seems should straightforward.

this post suggested put import inside class.. there alternatives?

you cannot @import inside css rule. @import statements must declared outside selectors.

from the mdn page on @import:

the @import css at-rule allows import style rules other style sheets. these rules must precede other types of rules, except @charset rules; not nested statement, cannot used inside conditional group at-rules.

such functionality require nested selectors, not exist in css. you have write such thing in less or sass, , preprocess css.

your linked question suggests creating less file import bootstrap's less code, , compile css.