I have some elements with `.z-depth-5`: Is there a way to av


Topic: I have some elements with `.z-depth-5`: Is there a way to avoid them shadows being overlapped?

bendy pro asked 7 years ago

My code I am trying to use is as the below - however the shadows get cut out by other nearby elements. Is there a way to 'pad' them space between them?
<div className="container">
 <div className="row">
 <div id="article" className="col-9 z-depth-5">
 <ArticleContainer data= {TextFeed} />
 </div>

 <div id='sidebar' className="col-3 z-depth-5">
 <img src={ImageFeed} />
 </div>
 </div>
</div>

Jakub Strebeyko staff answered 7 years ago

Hi there bendy, Thanks for reaching out! So, As I understand, the issue here regards the .z-depth induced shadow and it being overlapped by components beneath (like #arcticle's shadow being cut out by #sidebar). If that's the case, take a look here to learn all about Bootstrap's spacing utilities. Let me know whether it helped the case! Best Regards, Kuba

bendy pro commented 7 years ago

Perfect! Thanks Jakub :-)

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

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