figure.fixedratio{ padding-top: 11.69%; /* 450px/800px = 0.5625 / background-image: url(http://www.site.com/img/top.png); background-size: cover; -moz-background-size: cover; / Firefox 3.6 / background-position: center; / Internet Explorer 7/8 / -moz-box-shadow: 0 20px 20px #000; -webkit-box-shadow: 0 20px 20px #000; box-shadow: 0 20px 20px #000; / For IE 8 / -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')"; / For IE 5.5 - 7 */ filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000'); }
figure.fixedratio{
padding-top: 11.69%; /* 450px/800px = 0.5625 */
background-image: url(http://www.site.com/img/top.png);
background-size: cover;
-moz-background-size: cover; /* Firefox 3.6 */
background-position: center; /* Internet Explorer 7/8 */
-moz-box-shadow: 0 20px 20px #000;
-webkit-box-shadow: 0 20px 20px #000;
box-shadow: 0 20px 20px #000;
/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}
Y la llamas de esta Manera:
(figure class="fixedratio")(/figure)(figure class="fixedratio")(/figure)
cambia paréntesis por signos mayor y menor que.
<figure class="fixedratio"></figure>