فجوة كبيرة بين الدردشة وحاوية الموضوع

يجب أن يكون التباعد للمخطط الزمني للموضوع (الصورة أعلاه كمرجع)، وهذا هو السبب في أن المساحة لا تزال موجودة بدون clearfixes. لا تزال هناك مساحة للمخطط الزمني، حتى لو كان هناك منشور واحد فقط وحتى لو لم تكن مسؤولاً، حيث يظهر المخطط الزمني فارغًا ويبدو كمساحة فارغة.

قد يكون غير متسق أو مزعجًا إذا امتلأت هذه المساحة عند إضافة منشور جديد وظهور المخطط الزمني للموضوع، ولكن إذا كنت تريده أن يشغل المساحة الكاملة عندما يكون هناك منشور واحد فقط (بدون مخطط زمني)، يمكنك القيام بما يلي:

@media screen and (min-width: 925px) {
    .container.posts:not(:has(.timeline-scrollarea-wrapper)) {
        grid-template-columns: 100%;
    }
}

ملاحظة: يظهر .timeline-scrollarea-wrapper فقط إذا كان هناك عدد كافٍ من المشاركات لظهور المخطط الزمني، وهذا هو سبب نجاح هذا.

للمسؤولين (انظر الزر العائم):

لغير المسؤولين:

إذا كنت تريد بعض المساحة لزر الإعدادات، يمكنك تعديل هذا الجزء أو تحسينه:

grid-template-columns: 90% 10%;
grid-template-columns: calc(100% - 80px) 80px;

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

شخصيًا، سأتركه كما هو لضمان الاتساق مع توفر المخطط الزمني أو عدم توفره، ولكن إذا كنت ترغب في إجراء تغييرات عليه، فيجب أن يكون CSS أعلاه كافيًا لشغل العرض الكامل عندما يكون المخطط الزمني للموضوع فارغًا. أخبرنا إذا كانت لديك أي مشاكل مع هذا أو تحتاج إلى مساعدة في التنفيذ! شكرًا لك.

4 إعجابات