EricF

FYI, I found that the transparency was still being overridden on some pages so for anyone else doing this you have to add !important: /* delete .homepage if you want it on all pages */ body.homepage { position: relative; } body.homepage footer#footer-sections { position: absolute; bottom: 0; left: 0; z-index: 999; width: 100%; } body.homepage section, footer.sections .section-background { background: transparent !important; background: rgba(255, 0, 0, .0) !important; -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=1, StartColorStr='#00ff0000', EndColorStr='#00ff0000')"; filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr='#00ff0000', EndColorStr='#00ff0000'); zoom: 1 !important; }

Thank you!

@tuanphan thank you for helping out here. This has no effect on my site (using latest Safari 15.5 or Chrome 103). I have tried adding backup code to make the transparent style more robust, but it still has no effect. body.homepage footer.sections section, body.homepage footer.sections .section-background { background: transparent; background: rgba(255, 0, 0, .0); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=1, StartColorStr='#00ff0000', EndColorStr='#00ff0000')"; filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr='#00ff0000', EndColorStr='#00ff0000'); zoom: 1 !important; } (The red color is just for debugging the transparency.) Do you have any suggestion for this? My aim, more or less like the OP, is to get a full-bleed video background to look actually full-bleed instead of "half-bleed" 🤨. Thank you!