AODH Posted May 9, 2022 Share Posted May 9, 2022 Hi, I have an embedded video on my website that is not resizing for mobile view. Please see below:  Desktop View - Happy with this 🙂 Mobile View - Not happy with this 😞  I have use the following code injection to embed a video onto my site:  <video autoplay="autoplay" loop="true" width=900">   <source src="https://static1.squarespace.com/static/61126e32043e7f1bf0b43063/t/6240bc26d8515b154b08c851/1648409696060/Aodh+Design+The+Archway+House.webm" type="video/webm"/>  </video> I have tried using the following Custom CSS to resize it for mobile, which worked for interactive panorama images on my site, but does not work for this specific case: @media only screen and (max-width:640px) { #block-yui_3_17_2_1_1648411902101_34304{width:20%; margin:auto}}  Any help would be appreciated to get this video to scale to the width of a mobile in mobile view.  Many Thanks Link to comment
AODH Posted May 9, 2022 Author Share Posted May 9, 2022 If anyone comes across this post. I have solved it. I just had to change the code injection from: <....width=900" > to <....width=100%" >. So the final code injection for my case is shown below, instead of what it was in my initial post.  <video autoplay="autoplay" loop="true" width=100%">  <source src="https://static1.squarespace.com/static/61126e32043e7f1bf0b43063/t/6240bc26d8515b154b08c851/1648409696060/Aodh+Design+The+Archway+House.webm" type="video/webm"/> </video> NOMADsignal and tuanphan 1 1 Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment