So i have been designing my website, and i coded my shopify store to have a video background with text in the middle and it looks and works great, but then i decided to check my website on mobile and i have a giant black box which i cannot get rid of or make transparent. Any help/ code to fix this would be much appreciated, thank you.
Hello @jakegrieveson
Its Artzen Technologies! We will be happy to help you today.
Add this code to your CSS file OR theme.liquid file.
@media screen and (max-width: 767px){
.videoBackground .videoBox .videoBoxInfo {
background: transparent;
}
}
After that your site mobile view look like --:
Let me know if need further assistance
Regards,
Artzen Technologies
Thank you so much, it fixed the issue. however now at the bottom of the website there is a body of text, any idea how to get rid of this?
put this code in tag
like this
I just tried that, and then my website went back to having a black box but now with the text down the bottom, so i put the code you sent before back in and it fixed the box just not the text at the bottom, any more ideas?
please send screen short where r u added that code
if you add this code in base.css
add like this without style tag --:
@media screen and (max-width: 767px){
.videoBackground .videoBox .videoBoxInfo {
background: transparent;
}
}
if you add this code in theme.liquid
add like this with the style tag --: