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

حل مشکل اسکرول افقی

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

اما چجوری اسکرول افقی روی سایت رو حذف کنیم؟

برای حل این مشکل چنتا راه حل وجود داره که یکیش استفاده از کد css هستش.

استفاده از کد css

<style>
.class{
/* حذف اسکرول افقی */
overflow-x: hidden;
/* اسکرول عمودی */
overflow-y: auto;
}
</style>

و اما راه حل بعدی …

استفاده از المنتور برای حل مشکل اسکرول افقی در وردپرس

تو المنتور چک کنید که در همه بخش های انتخاب شده، حالت کشیدگی غیر فعال باشه.

غیر فعال کردن حالت کشیدگی

سعی کنید برای بخش های مختلف یه padding=10px در نظر بگیرید.

قرار دادن padding=10px در صفحه

و راه حل آخر اینکه در sectionهای مختلف خاصیت overflow (که احتمالا سرریز ترجمه شده!!) رو روی حالت hidden یا مخفی قرار بدید.

غیرفعال مردن حالت overflow هر سکشن

مشکل سایت من که با مورد آخر برطرف شد 🙂

بازگشت به لیست

12 دیدگاه در “علت ایجاد اسکرول افقی در سایت وردپرس چیست؟

  1. عالی بود ..ممنون از توضیحات عالیتون..منم برای سایت https://sedaye-bime.ir/ همین مشکل رو داشتم به انجام راه حل اینکه :
    راه حل آخر اینکه در sectionهای مختلف خاصیت overflow (که احتمالا سرریز ترجمه شده!!) رو روی حالت hidden یا مخفی قرار بدید.
    حل شد

    1. سلام دوست عزیزمون
      بله عالیه!!! کاملا درست گفتین برای سایت هایی که صفحه سازشون المنتوره این راه حلشونه :))
      موفق و پیروز باشید.

  2. مریم درویش زاده گفت:

    سلام. ممنون از راهکار خوبتون. منم با مورد آخر تونستم مشکل سایتمو حل کنم

    1. سلام مریم جان
      خداروشکر که تونسیم کمکی کرده باشیم.
      موفق باشید :))))

      1. عاطفه گفت:

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

        1. سلام و وقت بخیر
          بااین مشکل مواجه نشدم لطفا آدرس سایتتون رو واتساپ ارسال کنید تا بررسی بشه.

  3. محمود گفت:

    عالی بود. ممنون

  4. محمد گفت:

    سلام وقت بخیر منم مشکل اسکرول افقی داشتم که با مخفی کردن سرریز درست شد ولی وقتی هدر رو هم این کارو کردم منو هام در حالت موبایل چون منو همبرگری هست میره زیر المان ها و این مشکل رو دارم اگر هم سرریز رو پیشفرض بزارم کل سایتم اسکرول افقی میخوره چیکار میتونم بکنم لطفا راهنمایی کنید

    1. سلام و وقت بخیر دوست عزیز
      این مشکل رو تو همه صفحات سایت دارین یا صفحه خاصی؟
      در صورت تمایل ادرس سایتتون رو واتساپ ارسال کنید بررسی بشه.

  5. عسگری گفت:

    با این پست شما، مشکل اسکرول افقی ام حل شد.
    واقعا ممنونم ازتون.

  6. محمد گفت:

    حل نشد متاسفانه

    1. میتونید آدرس سایتتون رو در واتساپ ارسال کنید که بررسی بشه 🙂

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *