میثم اللهدادمن جستجو زیاد انجام دادم و می‌دونم این مشکل خیلی عمومی هست ولی از اون‌جایی که هر ایراد راه حل خودش رو داره مجبور شدم اینجا مطرحش کنم، چون هیچ‌کدوم از راهنمایی‌هایی که من پیدا کردم؛ برای من جواب نداد.
قالب من با ورژن‌های هفت به پائین IE مشکل داره و متأسفانه نتونستم ایرادیابی‌اش کنم. HTML رو Validate کردم؛ CSS رو Validate کردم؛ ولی جواب نگرفتم. یعنی در اصل فکر می‌کنم ایراد اصلی یا از Scrip ها هست یا از کدهای PHP، ولی از کجا؟ نمی‌دونم و نتونستم پیدا کنم. از اون‌جایی که به‌هم ریختگی طوری هست که روی اصل مطالب تأثیر منفی می‌ذاره، مجبورم که برطرفش کنم. لطفاً اگر پاسخی به ذهنتون می‌رسه راهنمایی کنید.
آدرس سایت: http://maysam.allahdad.com
-
-
میثم جان!
کد پی اچ پی به هیچ عنوان ربطی به مرورگر نداره!در حقیقت مشکل از خود IE!
تموم دنیا دارن داد میزنن که از IE استفاده نکنید واسه همین میگن!مشکلت رو هم بیخیال شو چون با ie7 که مشکل نداری دیگه درسته؟
الان کمتر کسی با ورژن پائینتر از 7 میاد
-
رضا جان متأسفانه با IE7 و پایین‌تر مشکل دارم.
-
خب پس اگه زیاد مهمه باید یه استایل جداگانه برای IE بنویسی و شاید برای هر ورژنش یه استایل .
و اون باگ ها رو فیکس کنی . -
اگه ایراد از CSS بود که رفعش می‌کردم. ایراد از استایل نیست.
-
یک نظر در باره قالب شما شاید کار ساز بود.
حالت Compatible را در اینترنت اکسبلورر (در هدر php دستور را قرار دهید) غیر فعال کنید به احتمال زیاد در IE8,9 مشکلی نخواهید داشت و احتمالا در IE7 -
مرتضی جان من این رو نفهمیدم:
حالت Compatible را در اینترنت اکسبلورر (در هدر php دستور را قرار دهید) غیر فعال کنید.
-
من سی اس اس قالب شما را تا حدودی بررسی کردم .سی اس اس قالب شما برای مرورگرهای پیشرفته نوشته شده و در آن اینترنت اکسپلورر لحاظ نشده به قول دوستمان یا استایل جداگانه بنویسید یا اینکه از دستور ریست استفاده کنید و استایل ریست برای اینترنت اکسپلورر قرار دهید.
برای نمونه استایل قالب شما
border-top-right-radius:4px;border-top-left-radius:4px;-moz-border-top-right-radius:4px;-moz-border-top-left-radius:4px;margin:0px
این دستورات گرد کردن گوشه ها توسط css3 است که در این دستورات اینترنت اکسپلوور نمیتواند آنرا بخواند و برای فیکس کردن باید از اسکریپت استفاده کرد و همچنین مشکل عمده از خاصیت z index که در سی اس اس
قالب شما استفاده شده (جابجایی منوهای باز شونده )معیار عددی z index درست لحاظ نشده
در ابتدا شما این دستور را در هدر php برای غیر فعال کردن حالت Compatible در اینترنت اکسپلورر قرار دهید اگه مشکل داشتید استایل باید باز بینی شود.
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8,9" />کاربران زیر به‌خاطر این نوشته تشکر کرده‌اند:
رضا ش - میثم الله‌داد -
مرتضی جان ممنونم. من اغلب قسمت‌های CSS رو خودم نوشتم. بعد برای اطمینان تمام اون کدهای radius رو حذف کردم، ولی درست نشده بود. موردی که شما گفتی رو هم چک کردم و باز مشکل داشتم. یعنی همون Compatible Mode
تنها چیزی که الآن می‌مونه توی مواردی که شما گفتی: z-index هست. به نظرت اگر درست عدد دهی نکرده بودم، توی بقیه مرورگرها هم نباید اشتباه نشون می‌داد؟ من با یکی از ناظم‌ها صحبت کردم و اون هم احتمال داد که از نسخه‌ی جی-کوئری فراخوان شده باشه. اگه ارورهای اسکریپت رو روشن داشته باشی، می‌بینی که به اسکریپت‌ها ایراد می‌گیره. ولی من نمی‌دونم کجاش هست. -
منظورم حذف اون کد ها نبود .اونها نتها گوشه های عناصر را گرد می کنه
و ربطی به جابجایی عناصر در قالب شما نداره اینها css3 هستند که در مرورگرهای پیشرفته که IE9 هم شاملش میشه ،
اجرا میشه.
این مثال بود از عدم تطبیق کد ها ی شما با IE6,7,8 و ربطی به مشکل نداره -
منظورم حذف radius نبود اون را فقط برای مثال گفتم که شما از css3 استفاده کردید و خیلی جاهای دیگه که اینترنت اکسپلورر نمیتونه بخونه.
در مورد z-index که قرار گیری هر عنصری را مشخص می کند شما ابتدا از 1000 شروع کنید و به مراتب 999 و 995 به همین منوال بر اساس قرار گیری عناصر مقدار را مشحص کنید . اینترنت اکسپلورر تنها از این نوع پشتبیبانی می کنه
در مورد قرار دادن کد در هدر php مشکل حالت Compatible را در IE8,9 حل میکنه یعنی اگه بازدید کننده مرورگر IE8 or 9 خود را روی حالت Compatible قرار دهد، با نبودن این کد دقیقا همان جابجایی منو ها را که در IE7 دارید خواهی داشت.
تا اینجا شما در مرورگر ie 8,9 را که در دو حالتشان چهار تا بودند را مهار کردید.
2:شما از اعداد منفی در قرار گیری عناصر استفاده کردید که این هم در IE7 به مشکل می خورد.
3: اگه اشتباه نکنم در قسمت منو شما position را fixed تعیین کرده بودید در این صورت محل قرار گیری از روی کل صفحه
محاسبه می شود ومقدار های شما بی اثر خواهد بود البته در IE 7 و حالت Compatible IE8,9 .
پس شما position را روی relative قرار دهید بعد مقدار را بر حسب پیکسل وارد کنید یعنی بالا پایین چپ و راست عنصر را
نسبت به عنصر در بر گیرنده
در مورد حذف دکمه Compatible از8,9 IE که از این هک
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8,9" />
استفاده میکنیم منظورم این دکمه است تصویر
امتحان کنید شما فعلا کد را در هدر درست قرار ندادید این کلید هنوز فعال است. با کلیک بر روی این دکمه قالب دقیقا مشکل IE7 را پیدا می کند.از این نتیجه میگیریم که مشکل اسکریپت نیست فقط سی اس اس مشکل داره.
البته در 8 IE
میدانید که از منوی تنظیمات این حالت فعال میشه.
بلاگ شما را مختصر خواندم قلم زیبایی دارید.کاربران زیر به‌خاطر این نوشته تشکر کرده‌اند:
میثم الله‌داد - -
من هم همین مشکل رو داشتم که با این پست به کلی برظرف شد.
-
مرتضی جان تشکر هم بابت اینکه وقت گذاشتی و پاسخ‌های مفصلی دادی، هم بابت اینکه وبلاگ رو خوندی و نظر دادی :)
من تازه فهمیدم اون هک هدر به چه دردی می‌خوره، دیشب گذاشتم و بعد برش داشتم. الآن ولی مجدد می‌گذارم که دیگه اون دکمه وجود نداشته باشه برای مرورگرها. ممنون.
بقیه‌ی موارد رو چک می‌کنم و نتیجه رو همین‌جا اعلام می‌کنم. -
maysam گفت:
رضا جان متأسفانه با IE7 و پایین‌تر مشکل دارم.ما پیر شدیم ولی این مایکروسافت نتونست مشکل مرورگرشو حل کنه...
-
سلام دوستان من یه افزونه نمایش پست دارم با مرورگر IE مشکل داره و مثلا با IE 11 چک کردم درسته ولی با 9 درست نیست
تو کد css اینا هست می شه راهنمایی کنید
میخوام با همه ورژن ها سازگار باشه
/** * SRP LAYOUT CSS * Package: special-recent-posts-free * Version: 2.0.4 * Author: Luca Grandicelli <lgrandicelli@gmail.com> * Copyright (C) 2011-2014 Luca Grandicelli * The stylesheet of the SRP widget layout */ /** * -------------------------------- * THE WIDGET TITLE * -------------------------------- */ .srp-widget-title {} /** * -------------------------------- * THE POSTS CONTAINER * -------------------------------- */ .srp-widget-container { display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Chrome */ display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */ -webkit-box-orient : vertical; -moz-box-orient : vertical; -webkit-flex-direction : column; -moz-flex-direction : column; -ms-flex-direction : column; flex-direction : column; -webkit-flex-wrap : nowrap; -moz-flex-wrap : nowrap; -ms-flex-wrap : nowrap; flex-wrap : nowrap; } /** * -------------------------------- * THE SINGLE POST * -------------------------------- */ .srp-widget-singlepost { border-bottom : 1px solid #ccc; margin-bottom : 10px; padding-bottom : 10px; } .srp-widget-container > .srp-widget-singlepost:last-child { border-bottom : 0; margin-bottom : 0; padding-bottom : 0; } .srp-post-content-container { display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Chrome */ display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */ } .srp-thumbnail-position-default { -webkit-box-orient: horizontal; -moz-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -moz-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } /** * -------------------------------- * THE THUMBNAIL BOX * -------------------------------- */ .srp-thumbnail-box { margin-right: 20px; } .srp-post-thumbnail-link { display: block; } .srp-thumbnail-box img { height: auto; } /** * -------------------------------- * THE CONTENT BOX * -------------------------------- */ .srp-content-box { -webkit-box-flex: 1; /* OLD - iOS 6-, Safari 3.1-6 */ -moz-box-flex: 1; /* OLD - Firefox 19- */ width: 20%; /* For old syntax, otherwise collapses. */ -webkit-flex: 1; /* Chrome */ -ms-flex: 1; /* IE 10 */ flex: 1; /* NEW, Spec - Opera 12.1, Firefox 20+ */ } .srp-content-box .srp-post-date, .widget-area .widget .srp-post-date { margin: 0 0 10px; } .srp-content-box .srp-post-title, .widget-area .widget .srp-post-title { margin: 0; } /** * -------------------------------- * THE POST TITLE * -------------------------------- */ .srp-content-box .srp-post-title, .widget-area .widget .srp-post-title { margin: 0; } .srp-content-box .srp-post-stringbreak-link { margin: 0 5px; } /** * -------------------------------- * THE POST CONTENT * -------------------------------- */ .srp-content-box .srp-post-content, .widget-area .widget .srp-post-content { margin: 0; } /** * -------------------------------- * MEDIA QUERIES * -------------------------------- */ /* Max-width 640px, mobile-only styles, use when QAing mobile issues */ @media only screen and (max-width: 40em) { /** * -------------------------------- * The Single Post * -------------------------------- */ .srp-post-content-container { -webkit-box-orient: vertical; -moz-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -moz-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .srp-content-box { -webkit-box-flex: none; /* OLD - iOS 6-, Safari 3.1-6 */ -moz-box-flex: none; /* OLD - Firefox 19- */ width: auto; /* For old syntax, otherwise collapses. */ -webkit-flex: none; /* Chrome */ -ms-flex: none; /* IE 10 */ flex: none; /* NEW, Spec - Opera 12.1, Firefox 20+ */ } /** * -------------------------------- * The Thumbnail Box * -------------------------------- */ .srp-thumbnail-box { margin: 0 0 10px; } }ممنون
رضا ش
mortezq21
kohaix
rcm27
aref.shams.2درباره‌ی این موضوع
- خوراک RSS برای این موضوع
- آغاز شده ۱۲ سال پیش توسط میثم الله‌داد
- آخرین پاسخ توسط aref.shams.2
- این موضوع
حل‌نشده
