شاشة تسجيل الدخول ليست في المنتصف على الشاشات الأصغر من 640 بكسل

تسجيل الدخول عبر الهاتف المحمول لموقعي محاذى لليسار بدلاً من أن يكون في المنتصف. حاولت تعديل الهوامش يدويًا ولكن هذا أثر على الصفحة الرئيسية أيضًا.

كنت أختبره في المفتش ووجدت أن 640 بكسل هو الحد الفاصل. عند 639 بكسل

<html lang="en" class="text-size-normal anon touch discourse-touch desktop-view not-mobile-device" style="--powered-by-height: 0px;"> == $0

يصبح

<html lang="en" class="text-size-normal anon touch discourse-touch mobile-view mobile-device" style="--powered-by-height: 0px;"> == $0

ما الذي يمكنني فعله للحفاظ على نافذة تسجيل الدخول في المنتصف على الهاتف المحمول دون التأثير على كيفية عرض الصفحات الأخرى؟

هل يمكنك مشاركة كيف فعلت ذلك؟ وربما تضمين لقطة شاشة للعرض الذي لا يعمل كما هو متوقع؟ شكرًا!

هذه بعض لقطات الشاشة للصفحة المعنية. (لقد قمت بطمس واجهة تسجيل الدخول الفعلية لأنها موقع خاص)

image

image

لا أتذكر تفاصيل ما فعلته لمحاولة إصلاح هذا من قبل لأنه كان الأسبوع الماضي، لكنني أعتقد أنني أضفت للتو هامشًا أيسر إلى <div id=”main-outlet”> وهو الصندوق الأبيض الذي تراه أعلاه.

لاحظت أيضًا أن السطر <div class=”card-cloak hidden”></div> يظهر أسفل <div id=”main-outlet”> عندما يكون العرض أقل من 640 بكسل.

image

إعجاب واحد (1)

أعتقد أن هناك قاعدة CSS هنا تحد من عرض #main-outlet. أظن أنها في السمة المخصصة الخاصة بك. عندما أستخدم Horizon (هل هذا مبني على Horizon، نعم؟)، لا أرى نفس المشكلة.

أوه، أنت على حق!

أنا أستخدم Horizon، آسف نسيت ذكر ذلك. كنت أحدد عرض المنفذ الرئيسي لترك مساحة لدفع الشريط الجانبي حتى لا يلتصق بحافة الشاشة.

لقد تراجعت عن تلك التغييرات، لذا فإن شاشة تسجيل الدخول الآن تشغل 100٪ من الشاشة كما ينبغي. يجب أن يلتصق الشريط الجانبي بحافة الشاشة الآن ولكن هذه ليست مشكلة سيئة على الإطلاق.

شكرا لك!

إعجاب واحد (1)