некорректно работает margin-top and margin-left

Мне нужно, чтобы .img1 был передвинут с помощью margin-top and margin-left в процентах также, как если бы я указал left:98px; and top:38px;

.general {
    margin:0 auto;
    max-width:1366px;
    height:5797px;
    width:100%;
}
.div1 {
    max-width:1366px;
    width:100%;
    height:670px;
    background-color:rgb(233,233,233);
}
.img1 {
    position:absolute;
    margin-left:7.17%; 
    margin-top:5.67%;
}
<--!HTML -->
<div class="general">
<div class="div1">
    <img src="01_one_page.png" class="img1">
</div>
    </div>

</body>
</html>

я не знаю как считать процентное позиционирование, я не нашел информации за несколько дней (вероятно я плохо искал, но я уже сдался и не хочу искать вновь). Под процентным позиционированием я понимаю то, что зная ширину и высоту родительского блока, можно было бы рассчитать как в процентах указать margin так, чтобы можно было переместить на нужное кол-во пикселей любой элемент.