Topic: I have some elements with `.z-depth-5`: Is there a way to avoid them shadows being overlapped?
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>
Add comment
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
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
Resolved
Specification of the issue
- ForumUser: Pro
- Premium support: No
- Technology: MDB React
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: No
Tags