Как закрепить изображение с нестандартным соотношением сторон?

Question

[Карина]

Всем привет.
У меня есть изображением, оно у меня идет бэкграундом. Изображение:
height = 1611
width = 1266

Я не знаю как его прикрутить. На моем стандартном мониторе - 1280 x 800 смотрится нормально.
На каком-то приплюснутом человек заходит и у него верха изображения нет, но если начинаешь отдалять, то всё нормально становится.

У меня какая верстка:

<div class="wrapper">
    <div class="backround">
     ...
    </div>
</div>

.wrapper{
	width: 100%;
	position: relative;
}

.backround{
	background: url(background.jpg) 100% 100% no-repeat;
	background-size: cover;
	height: 1611px;
	width: 100%;
}

Answer 1

[Kater-auf-Dach]

Требуется таким образом?

Comments

[Kater-auf-Dach]

Увидел сайт. Значит, не таким.

[Карина]

Kater-auf-Dach: а это вообще реально сделать? или это только разрешение у картинки менять?

[Kater-auf-Dach]

iKapex IMHO, тут что получается. Картинка намного меньше экрана, высота задана четко - как ее масштабировать? Либо пропорционально - но тогда по краям будут отступы, либо растягивать на весь экран - но тогда и растянется картинка, как-то так: codepen.io/anon/pen/emXRog
PS. У вас, кстати, текст выпадает из фона.

[Kater-auf-Dach]

iKapex: И вообще, такое мелкое изображение при крупном увеличении смотрится ужасно. Возьмите фото в высоком разрешении, и проблема решится.

[Карина]

Kater-auf-Dach: спасибо большое за советы, чего-нибудь попробую сделать. А куда выше разрешение, оно ж и так больше стандартного 1280 х 800

[Kater-auf-Dach]

iKapex: Сандарт для мониторов сейчас - 1920x1080, у многих выше (про retina, 4к, 5к промолчу). Даже у ноутов минимум 1366x780.
И еще. Не совсем понятна запись: "background: url(background.jpg) 100% 100% no-repeat;" - зачем позиционируете картинку в правом нижнем углу?

[Карина]

Kater-auf-Dach: ок, спасибо. Я переделала на background-position: 50% 50%; но делу это всё равно мало помогло. Сама картинка кривая, блин

Answer 2

[mr_firuzinho]

Напишите адрес сайта

Comments

[Карина]

laboratory7.com

Answer 3

[Карина]

Может это как-то js можно решить?