PDA

View Full Version : سوال: کد های مناسب برای هر مرورگر



hasan2afm
جمعه 30 مرداد 1394, 04:06 صبح
بانام خداوند مهربان و بخشایش گر

من مشکلی در کد های css داشتم

وقتی سایتم رو با مرورگر کروم باز میکنم با این کد ها جلوه ها به خوبی نمایش داده میشه بدون هیچ ایرادی


{ cursor: default; width: 152px; line-height: 30px; font-size: 13px; word-wrap: break-word; padding: 00px; margin: 2px 0px; background: #f6f6f6; background: -moz-linear-gradient(top,#f6f6f6 0%,#e5e5e5 100%); background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#0D0838),color-stop(100%,#185415)); border: 1px solid #6B56E2; -moz-box-shadow: 0px 1px 0px rgba(255,255,255,1) inset,0px 1px 0px rgba(0,0,0,0.3); -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,1) inset,0px 1px 0px rgba(0,0,0,0.3); box-shadow: 0px 1px 0px rgba(255,255,255,1) inset,0px 1px 0px rgba(0,0,0,0.3); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; color: #E2470E; display: inline-block; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-box-shadow: inset rgba(0,0,0,0.2) 0px 0px 0px 1px; -moz-box-shadow: inset rgba(0,0,0,0.2) 0px 0px 0px 1px; box-shadow: inset rgba(0,0,0,0.2) 0px 0px 0px 1px;}

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


{ cursor: default; width: 152px; line-height: 30px; font-size: 13px; word-wrap: break-word; padding: 0px; margin: 2px 0px; background: transparent -moz-linear-gradient(center top , #120D41 0%, #365060 100%) repeat scroll 0% 0%; border: 1px solid #3C07D6; border-radius: 3px; color: #EFEFEF; display: inline-block; transition: all 0.2s ease-in-out 0s; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset;}

مشکل حل مشه ولی این بار در گوگل کروم با مشکل مواجه میشم

لطفا کمک کنید چون بد جور رفته رو اعصابم

anvar
جمعه 30 مرداد 1394, 09:37 صبح
شما باید هر دو تا دستور رو در کنار هم داشته باشید - اگر مرورگر کاربر کروم بود از خط اول استفاده می کنه اگر فایرفاکس بود از خط دوم و برای سایر مرورگرها هم باید دستورات مستقلی اضافه کنید

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

hasan2afm
جمعه 30 مرداد 1394, 13:23 عصر
میشه یک مثال بزنید؟

2020s1371
یک شنبه 01 شهریور 1394, 16:12 عصر
میشه یک مثال بزنید؟
چیزی مثله چیزی که خودت نوشتی:
-webkit-box-shadow: inset rgba(0,0,0,0.2) 0px 0px 0px 1px;
-moz-box-shadow: inset rgba(0,0,0,0.2) 0px 0px 0px 1px;
اولی رو کروم و.. مشناسن
دومی رو هم فایرفاکس