janmorgan Posted April 8, 2022 Share Posted April 8, 2022 Site URL: https://surfingmarocco.squarespace.com/ Hi there, I see this was a problem on March 3, 2022 also, but fixed without an answer appearing on the forum! So I have several videos on the page (using <> code from youtube) and none of them fit into the cell phone width. Please could someone help... perhaps I can just edit the squarespace code but I don't know what it should be changed to sorry! I've fiddled with the settings for the page width to no avail. Thank you, happy weekend! Jan Link to comment
TheSquareSpacer Posted April 8, 2022 Share Posted April 8, 2022 I think the site is password protected, However the solution to this problem is Add two video, One for desktop: 16:9 ratio Other for mobile: 4:3 ratio, Now hide Desktop Video on Mobile and Vice versa. // To hide the Desktop Video on mobile #ID { display: none !important; } // To hide the mobile Video on Desktop @media only screen and (max-width: 449px) { #ID { display: none !important; } } Inspect the Element to find the id and replace it with ID in the code. Get Our MultiCurrency Extension for Your Site (7.0 & 7.1) Feel free to reach out for help and projects! The Squarespacer Limited Link to comment
tuanphan Posted April 10, 2022 Share Posted April 10, 2022 On 4/9/2022 at 12:07 AM, janmorgan said: Site URL: https://surfingmarocco.squarespace.com/ Hi there, I see this was a problem on March 3, 2022 also, but fixed without an answer appearing on the forum! So I have several videos on the page (using <> code from youtube) and none of them fit into the cell phone width. Please could someone help... perhaps I can just edit the squarespace code but I don't know what it should be changed to sorry! I've fiddled with the settings for the page width to no avail. Thank you, happy weekend! Jan Try adding this to Design > Custom CSS /* Mobile Youtube */ @media screen and (max-width:767px) { iframe[src*="youtube"] { width: 100% !important; } } bouleverser and Bermzies 1 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
bouleverser Posted May 30, 2022 Share Posted May 30, 2022 (edited) On 4/11/2022 at 1:23 AM, tuanphan said: Try adding this to Design > Custom CSS /* Mobile Youtube */ @media screen and (max-width:767px) { iframe[src*="youtube"] { width: 100% !important; } } This worked for me! However, I'm still having the same issue with a Google Forms Survey embedded just below my Youtube Video. Now, the video is within the confines, but the survey still extends past. Any advice? Thank you!!! Edited May 30, 2022 by bouleverser Link to comment
tuanphan Posted June 1, 2022 Share Posted June 1, 2022 On 5/30/2022 at 6:03 PM, bouleverser said: This worked for me! However, I'm still having the same issue with a Google Forms Survey embedded just below my Youtube Video. Now, the video is within the confines, but the survey still extends past. Any advice? Thank you!!! Can you share link to page where you use Google Form? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
philipcondron Posted October 8, 2022 Share Posted October 8, 2022 Tuanphan I have to say, you are the light at the end of the tunnel. I've been on many forums looking for solutions which others are experiencing also and you are always there with an answer. Thank you for your help! 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