Web Development

A lot of developers and designers work with bootstrap nowadays and sometimes you need to override rules created by default by the framework. Here’s something I needed to remove a while back.

.progress {
    -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,0.15);
    box-shadow: inset 0 -1px 0 rgba(0,0,0,0.15);
}

Progress bars have a default box-shadow. To remove it, simply add a rule to change the value to none

// from bootstrap
.progress {
    -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,0.15);
    box-shadow: inset 0 -1px 0 rgba(0,0,0,0.15);
}

//custom
.no-shadow {
    -webkit-box-shadow: none;
    box-shadow:none;
}

Apply this to your own elements

<div class="progress no-shadow">
  <div class="progress-bar no-shadow"></div>
</div>

Done!

.