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
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 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