Решение SVG
Легко решает проблемы с позиционированием и адаптивностью изображений при изменении размеров дисплея. Изображение не обрежется по краям, если вы его добавите внутрь svg файла.
<image xlink:href="leftTopBack.png" width="100%" height="100%" />
При уменьшении, увеличении размеров экрана, контейнера, в который лучше обернуть, добавленный инлайн svg, изображение будет находиться в одной системе координат с SVG и меняться пропорционально.
<style>
.container {
width:100%;
height:100%;
background:grey;
background-size:cover;
background-position: 0% 100%;
}
</style>
<div class="container">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%" viewBox="0 0 500 272" preserveAspectRatio="xMinYMin meet" >
<image xlink:href="https://i.stack.imgur.com/zDLMO.png" width="100%" height="100%" />
</svg>
</div>