مشكلة فى تنسيق الصفحة ب خاصية position

يمكنك توسيط ال div عن طريق التالي

div{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%)
}

الكود السابق يقوم بتوسيط ال div أفقياً وعمودياً

وستلاحظ أنه في الشاشات الصغيرة يبقى في المنتصف ولا يتحرك لأن في الكود السابق نستخدم ال % كوحدة قياس في نسبية لذلك يبقى ال div في المنتصف

ويمكنك أيضاً استخدام ال flexbox أفضل

container{
  display: flex;
  justify-content: center;
  alighn-items: center;
}

ال container هو العنصر الأب لل div لاحظ أنه في الشاشات الصغيرة أيضاً لا يتحرك من المنتصف