اصبح المشروع غير متجاوب عند اضافة AOS

المشروع لديك سليم لا مشكلة به، لكن المشكلة من المتصفح جوجل كروم نفسه، فهو يُضيف مساحة بيضاء زائدة ناحية اليسار أو اليمين أحيانًا، لذا لحل تلك المشكلة قم بوضع التالي أثناء التطوير في ملف app.css

html, body { overflow-x:hidden; }

أو تستطيع استخدام الإضافة التالية لإختبار التجاوبية:

• Pixefy - Responsive Design Checker

المشكلة الوحيدة التي ستظهر خاصة بقسم contact US في أصغر مساحة شاشة، بسبب وجود padding لذا قم بحذفه عن طريق تطبيق التالي:

@media (max-width: 320px) {
    .doctors {
        max-width: 1200px;
        margin: auto;
        /* padding: 0 3rem; */
        margin-top: 28%;
    }
}