Live
<div class="container"> <button class="btn">Button</button> <button class="btn active">Button</button></div>
Live
x
/* Try to change order: */@layer bootstrap, my-base, my-styles;/* Importing Bootstrap as layer Bootstrap: */@import url("https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css")layer(bootstrap);/* Cascade Layers: */@layer my-styles { .btn { background: #abab9d !important; }}@layer my-base { body { margin: 2rem; background-color: #f2f0ec; } .btn { background: #8c4615 !important; }}
External CSS
This Pen doesn't use any external CSS resources.
External JavaScript
This Pen doesn't use any external JavaScript resources.