Remove shadow from elements


Topic: Remove shadow from elements

Manouher asked 4 years ago

Some elements come with default shadow, like the navbar or the buttons. how to remov this shadow

Marta Szymanska staff pro premium answered 4 years ago

Hi, go to _custom.scss file and if you don't want shadow in navbar or button, paste this code: .navbar { box-shadow: none !important; } .btn { box-shadow: none !important; } Best, Marta

nanoo commented a year ago

Hi martha ! i use mdb-navbar component and this tricks doeasn't works for me. have any idea ? tx a lot, Arnaud.


Marcin Luczak staff commented a year ago

Hello Arnaud,

It will work if you are using any type of file bundler such as Gulp or Webpack to compile your .scss files. Otherwise, you'll have to include .navbar { box-shadow: none !important; } directly inside <style> tag in your HTML <head>.

You can check how to use Gulp or Webpack from our tutorials:

Gulp - you can check out and learn how to work with it from one of our tutorials here: https://mdbootstrap.com/education/bootstrap/gulp-installation/

Webpack - you can check out and learn how to work with it from our article here: https://mdbootstrap.com/articles/jquery/md-bootstrap-webpack-tutorial/

Regards, Marcin


Marta Szymanska staff pro premium answered 4 years ago

Hi, which version of MDB do you have? And do you use SCSS files or only CSS links? Best, Marta

mdbpenguinglu pro commented 4 years ago

Same question. Use SCSS

Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: Other
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No