Shape 5

Joomla Templates => Charity - Club => : heatherz January 18, 2018, 04:58:14 PM



: Responsive Issue with video on Home Page and text to the right
: heatherz January 18, 2018, 04:58:14 PM
I have the Charity template installed on a site that previously used a different template (so didn't start with a site shaper installation). However, I also installed a site shaper site  elsewhere so I could recreate the module that includes the video player and text to the right as seen on the demo.

On full screen everything looks great. As you resize the screen however, the video just gets smaller. At mobile size, I have a tiny video and copy to the right, rather than a full width video and the copy beneath the video as seen in the demo.

I tried starting from scratch again - copied and pasted the exact code from the demo and just changed the link to the video, but I still did not get the expected responsive behaviour.

Hoping you might be able to see what is amiss. Link to my site is: http://bit.ly/2DjWw45

Thanks


: Re: Responsive Issue with video on Home Page and text to the right
: mikek January 19, 2018, 08:15:29 AM
Hello,

That is because you've modified the css by adding in your own custom.css. This for example is overriding the width:

.video_wrap_right {
    float: right;
    width: 53%;
    padding-top: 15px;
}

That is in your custom.css file. That will override the width at all screen widths. You need to remove any calls for video_wrap_right and video_wrap_left in your custom.css file for it to perform correctly.


: Re: Responsive Issue with video on Home Page and text to the right
: heatherz January 19, 2018, 12:48:56 PM
Okay, right I totally forgot about those changed rules. Originally I had tried to bring a YouTube video into that space rather than playing it from the site. I did change a couple of rules to get things looking like I wanted - looked okay on full screen but a disaster on mobile size so I went back to the mp4 yesterday, totally forgetting about the rules I changed.

Thanks, I appreciate the help :)