Hi Munir

Difficult to give you an exact answer with out been able to view an example of your video however the following article might help.. http://avexdesigns.com/responsive-youtube-embed/

HTML can be added using Joomlas CodeMirror editor and CSS can be added via your templates parameters (Custom CSS field).

Ciarán

Thanks I will try the article given and will reply you if i still feel any problem

The article seems helpful, can you please guide me how to edit the css.

I mean which file I had to edit and where should I place the following code

.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; height: 0; overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

Hi Munir

You can add this to the Custom CSS field of your templates parameters (Extensions -> Template Manager -> [YourTemplate] -> Custom CSS.

Ciarán

If you paste it into the box that Ciaran has indicated, and leave it there, it changes the CSS code, well, it seems to me, quite magically. There's some powerful wizard-like engine that makes it work. If you delete the code later, the CSS reverts back to its original state. So you can feel free to play with CSS code knowing that at any time you can revert to the original template's coding.

This still amazes me. I love Joomla51.

Love the little Alien, too. I've driven by Area 51. :laugh:

I had implemented the code in template and its adjusting the video fine but there i came to huge problem, after placing video I then write few more text in below it, amzingly the line spacing between text gots too much space, in back end i did not put any space , the text is just like i am writing here (max just 1 enter) only but at front end see how huge the space become and I am unable to figure out how to handle that.

See the issue at http://mysite.cluhost.info/ ,

There is only one article publish at main page, it contain video and some text but you can see too much spacing between text and video and after the end of text.

Please reply me urgent as I had to finalize the site ASAP.

You appear to have a large number of <div class="video-container"> </div> divs in your article where you only need one. May I suggest setting your editor to 'CodeMirror' (Global Configuration) and removing all these divs except for the one containing the video.

Ciarán

Check my site http://www.canadawestla.com/

I had implemented the above code to make video responsive and its worked, after doing some more work on site, now when i check the video does not getting responsive and appearing bigger.

Can you please tell me whats wrong?

You appear to have already amended this issue?

Ciarán

Yes, its working fine now. Thanks

I had added few more codes to css , not sure what has happened but the video is not more responsive now.

Our webstie is http://www.canadawestla.com/

Also see the attached pictures, you can see video box is wide then screen,



Whats wrong

Hi Munir

I can't really answer your video query as it is not template related. I would suggest going back to the original tutorial on the subject.

Ciarán