مشکل بوت استرپ در نمایش موبایل

سلام مبارک باشه، قالب تون هم دلنشین هستش.
همه ی صفحات سر زدم، هیچ مشکلی هم مشاهده نکردم.

پیشنهاد: به نظرم فقط ارتفاع فهرست تون وقتی بالای صفحه قرار میگیره خیلی زیاد هستش، بخش زیادی از صفحه رو اشغال میکنه. ولی در کل مشکلی مشاهده نکردم.

@milad

ممنون
توی حالت موبایل مشکل داره
نگاه کنین
صفحه اصلی درسته >> http://s6.picofile.com/file/8389085342/photo_2020_02_23_18_31_10.jpg
صفحه های دیگه مثلا تماس با من >> http://s6.picofile.com/file/8389085326/photo_2020_02_23_18_31_04.jpg

به خاطر فایل های png هست که تویی سایتت قرار دادی

    <img src="images/illustrations/page-title.png" alt="illustrations" class="bg-shape-1 w-100">
    <img src="images/illustrations/leaf-pink-round.png" alt="illustrations" class="bg-shape-2">
    <img src="images/illustrations/dots-cyan.png" alt="illustrations" class="bg-shape-3">
    <img src="images/illustrations/leaf-orange.png" alt="illustrations" class="bg-shape-4">
    <img src="images/illustrations/leaf-yellow.png" alt="illustrations" class="bg-shape-5">
    <img src="images/illustrations/dots-group-cyan.png" alt="illustrations" class="bg-shape-6">
    <img src="images/illustrations/leaf-cyan-lg.png" alt="illustrations" class="bg-shape-7">

@juza66

من قالب رو درست نکردم و سر رشته ای از فرانت سایت ندارم، آماده گرفتمش
مشکل از عکس هاست؟
ولی
صفحه اصلی درسته >> http://s6.picofile.com/file/8389085342/photo_2020_02_23_18_31_10.jpg
صفحه های دیگه مثلا تماس با من >> http://s6.picofile.com/file/8389085326/photo_2020_02_23_18_31_04.jpg

راست کلیک کن و inspect بزن و اون فایل های png رو حذف کن میبنی درست میشه یا تویی ریساز حذف کن یا عرض رو اتومات بذار

@juza66

آها مشکل رو فهمیدم ولی نمیدونم چجوری حل کنم؟
نمیشه کاری کرد توی نسخه موبایل اون عکسا نشون داده نشه؟

عرض رو اتومات بذار

چطوری؟

از مدیا در CSS استفاده کن

@media screen and (min-width: 1024px) {
  body {
    background-color: purple;
  }
  body:after {
    content: "در حال حاضر عرض محدوده نمایش برابر یا بیشتر از 1024px می باشد. ";
  }
}

آقای موسوی درست میگن، مشکل ناشی از همین عکس ها هستش.
دو مورد از عکس ها رو حذف کنید، باید مشکل تون کلا حل بشه:
عکس با کلاس bg-shape-7 و bg-shape-5 رو حذف کنید از قالب تون.

@milad
@juza66

ببخشید بازم نتونستم

الان اینجوری گذاشتم کار نکرد
چطوری دقیقا بذارم؟

@media screen and (min-width: 1024px) {
    .bg-shape-1::after,.bg-shape-2::after,.bg-shape-3::after,.bg-shape-4::after,.bg-shape-5::after,.bg-shape-6::after,.bg-shape-7::after {
        display: none;  
    }
}

7 تا عکس با همین کلاس ها هست، میخوام توی موبایل دیده نشه هیچ کدوم
ممنون میشم راهنمایی کنین

@elyasbeshkani
ببین شما اومدی

display: none

دادی نباید اینو به after بدی باید به خود کلاس بدی اینو و راحت ترین راه اینه که خود بوت استرپ این کلاس رو داره یعنی شما روی تصاویری که نمی خوای نمایش داده بشه فک کنم کلاس d-none رو بهش بده و از عرضی که می خوای مجدد نمایش داده بشه کلاس بلوک رو بهش بده
فک کنم d-xl-block باشه
در واقع باید اون المنت های تصویرت رو این کلاس ها بهش اضافه بشه

<img class="d-none d-xl-block">

یه همچین حالتی حالا اسم دقیق کلاسها یادم نیست، توی مستندات بوت استرپ نیگاه کنی هستش

@milad
@juza66
خیلی ممنونم ازتون بابت کمکتون

@hossein.r.1442
تشکر حالت دوم خیلی راحت تر بود

@hossein.r.1442
@milad
@juza66

ببخشید
توی این صفحه چرا اسکرول افقی هست؟ (موبایل)
https://elrak.ir/project.php?id=14

و اینکه همه المان ها و... توی حالت موبایل یکم زیادی بزرگه چیکار میشه کرد؟!
مخصوصا قسمت هدر

@elyasbeshkani
توی المنت تصویر نمونه که نوشته دیبا فود یه کلاس mr-5 داری اونو باید توی مدیای موبایل برداری تا مشکلت درست بشه

@elyasbeshkani
واگه منظور از بزرگی اون تایتل هستش میتونی این استایل رو

.page-title {
padding: 250px 0 150px;
}
توی مدیای مورد نظر که اینجا موبایله بکنی
.page-title {
padding: 120px 0 120px;
}

به نظر من اگر قالب رو بصورت آماده دارین استفاده می کنید، دیگه خیلی سخت نگیرید، انتظار نداشته باشید که همه چیزش سفارشی باشه.
راه حل دیگه هم اینه که قالب رو به کسی که طراحی رابط کاربری بلده بسپرید، تغییرات لازم رو بده، بعدش مجدد تحویل بگیرید.