Skip to content

Commit

Permalink
rename the mixin to responsive-embed
Browse files Browse the repository at this point in the history
  • Loading branch information
msadouni committed Oct 25, 2012
1 parent 51cf251 commit fd4cc64
Show file tree
Hide file tree
Showing 2 changed files with 6 additions and 4 deletions.
8 changes: 5 additions & 3 deletions README.md
Expand Up @@ -2,6 +2,8 @@

This extension helps embedding videos and iframes in responsive designs.

It provides a `responsive-embed` mixin to apply on an element containing an embed, to scale it while keeping its ratio.

See the blogs posts from [Anders M. Andersen](http://amobil.se/2011/11/responsive-embeds/) and [A List Apart](http://www.alistapart.com/articles/creating-intrinsic-ratios-for-video/) for more information.

## Installation
Expand Down Expand Up @@ -43,17 +45,17 @@ In your stylesheet:

// 16/9 embed
.embed-16-9 {
@include embed-container(16/9);
@include responsive-embed(16/9);
}

// 4/3 embed
.embed-4-3 {
@include embed-container(4/3);
@include responsive-embed(4/3);
}

// default 1 ratio for a square embed
@embed-1-1 {
@include embed-container;
@include responsive-embed;
}

You can use any ratio, as long as the result can be converted to percentages.
Expand Down
Expand Up @@ -4,7 +4,7 @@ $responsive-embeds-default-ratio : 1 !default;
// Mixin
//
// $ratio : any valid ratio like 16/9, 4/3...
@mixin embed-container(
@mixin responsive-embed(
$ratio : $responsive-embeds-default-ratio
) {
position: relative;
Expand Down

0 comments on commit fd4cc64

Please sign in to comment.