Simple Way to Make Your Embed Video Responsive Using Only CSS

Last Updated: December 23, 2014 | Reading Time: < 1 minute

Simple way to make your Embedded video responsive within a minute, is by adding CSS rule:

[css]
.post iframe {
width: 100% !important;
}
[/css]

You can add the code into style.css if you working on WordPress based website.

Targeting Youtube video:
[css]
iframe[src*=youtube] {
width: 100% !important;
}
[/css]

Targeting Vimeo video:
[css]
iframe[src*=vimeo] {
width: 100% !important;
}
[/css]

See this demo.

Leave a Comment

Comments

No comments yet. Why don’t you start the discussion?

    Any idea? Fill the comment below

    This site uses Akismet to reduce spam. Learn how your comment data is processed.