الموديل يظهر بهذه الطريقه في بوتستراب ما السبب 

هل يمكنك توضيح سؤالك بدقة أكثر ؟ 

حسب رؤيتي لماذا يظهر بهذا الشكل ، أرى أنه يظهر أسفل الطبقة السوداء لذلك يظهر على هذا النحو يمكنك معالجة المشكلة باستخدام الخاصية 

z-index

أما إذا عن تنسيقات model قم بمراجعة التنسيقات من خلال أدوات المطور ورؤية التنسيقات التي تؤثر على النصوص . 

يبدوا أن الـ overlay الخاص ببوتسراب يظهر فوق عنصر البطاقة،

عموما، قد تكون هاته المشكلة بسبب خطأ في توصيف هيكلة عنصر modal الخاص ببوتستراب ولذلك تأكد من ذلك. 

في حالة التعذر، قد تحتاج تجاوز خاصية z-index الخاصة بالعنصر المعني لإظهارها فوق الجميع:

myModal.in{
    z-index: 999999;
}

بالإضافة للحلول السابقة 

فإذا كان عنصر النافذة المنبثقة model بداخل عنصر  لديه موضع ثابت أو نسبي أي الخاصية position ، فسوف تحدث هذه المشكلة.

هناك طريقتان لحل المشكلة:

• أسهل طريقة هي نقل عنصر النافذة المنبثقة model ليكون خارج أي عناصر لديها الخاصية position. لذلك قم بنقل ال model  قبل علامة إغلاق عنصر الجسم </body>.
• بديلا، يمكنك إزالة خصائص الموضع position من النافذة المنبثقة وأصولها حتى يتم حل المشكلة. قد يؤدي هذا إلى تغيير مظهر ووظيفة الصفحة، ومع ذلك.