картинка во весь экран

[cha0s]

#about_us_logo {
background: url(img/about_logo.jpg);
background-repeat: no-repeat;
-o-background-size: 100% 100%, auto;
-moz-background-size: 100% 100%, auto;
-webkit-background-size: 100% 100%, auto;
background-size: 100% 100%, auto;
}

<div id="about_us_logo"></div>

Все хорошо как-бы, но как сделать чтоб при уменьшение экрана эта картинка которая на весь экран не уродовалась сжимаясь, а прятала свои края и оставалась всегда по центру(то есть overflow:hidden той части которая не попадает во весь экран)

нашел пример http://jsfiddle.net/LSKRy/654/
тут реализовано все так как мне нужно, при уменьшение картинка обрезается и всегда остается по центру, вопрос можно ли такое реализовать на одном <div id="about_us_logo"></div> без этих right: -50%; / left: -50%; div блогов как на образце.

[рони]

cha0s,
Пропорциональное центрирование картинки на бекграунде

[cha0s]

спасиб, но нужно этот resize чтоб работал именно на этой структуре <div id="about_us_logo"></div> без добавления картинки так таковой во внутрь контейнера, просто внутри блока у меня куча других блогов со своей информацией которая отображается на full width картинке, не могу я туда добавлять <img ....> куча всего разлетается тогда сразу.

глупо наверное будет данную штуку

$(window).load(function () {
    $("img").fullCenter()
});
$(window).resize(function () {
    $("img").fullCenter()
});

вешать на мой div, ибо там уже наверное бред будет если он к divu будет добавлять свои
..........
width: a / b * c,
height: a,
left: -(a / b * c - f) / 2,
top: -(a - e) / 2
.........

[рони]

cha0s,
background: url(img/about_logo.jpg) 50% 50%;
background-repeat: no-repeat;
-o-background-size: cover;
-moz-background-size: cover;
-webkit-background-size: cover;
background-size: cover;

[cha0s]

воо так и думал что должно быть что-то на css! отлично работает! спасибо как обычно тебе