مشکل با background-image در IE

[alibaghi]

سلام
من در css هر کاری کردم background-image در همه مررگرها Firefox و Opera و gg مشکلی نداره اما در IE نمایش داده نمیشه ؟؟؟


background-image: url(../img/banner.jpg);


background-image: url('img/banner.jpg');


background-image: url(http://www.mysite.com/img/banner.jpg);


مشکل از کجاست ؟

[Keramatifar]

دوست عزیز
شما باید برای CrossBrowser شدن بقیه ی مشخصه های مربوطه به Background رو هم تنظیم کنید
مثال:

background-position: top right;
background-repeat: repeat-x;


و یا صورت خلاصه نویسی:

background: gray url(http://www.mysite.com/img/banner.jpg (http://www.mysite.com/img/banner.jpg%29;)) repeat-x top right;

[alibaghi]

انجام دادم باز هم نشد

[Mr FTHEL]

کدتو کامل اینجا بزار تا واسط درستش کنم ;)

[alibaghi]

body
{
font: normal 85% arial,verdana,tahoma,sans-serif;
color: #777;
margin: 0;
padding: 0;
background: #f0f0f0;
}

#wrapper {
width: 960px;
min-height: 800px;
margin: 20px auto;
padding: 20px;
background: #fff;
border: 1px solid #ccc;
overflow: hidden;
}

#top
{
width: 960px;
height: 120px;
background-image: url(../img/banner.jpg);
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomleft: 10px;
-webkit-border-bottom-left-radius: 10px;
}

.line {
width: 960px;
height: 1px;
margin: 40px 0;
background: #ddd;
overflow: hidden;
}

/* TYPOGRAPHY */

h1, h2, h3
{
font-size: 3.5em;
font-weight: normal;
letter-spacing: -1px;
line-height: 1.0em;
color: #000;
margin: 0 0 5px 0;
text-align: center;
}

h2 {
font-size: 2.3em;
letter-spacing: -1px;
color: #999;
margin: 0 0 30px 0;
}

h3
{
font-size: 1.7em;
letter-spacing: 0px;
color: #000;
margin: 70px 0 20px 0;
padding: 0 0 20px 0;
border-bottom: 1px solid #ddd;
text-align: justify;
}

h4 {
font-size: 1.5em;
font-weight: normal;
line-height: 1.1em;
color: #f0f0f0;
margin: 0;
padding: 10px 50px 0 0;
}

p
{
font-size: 1.0em;
line-height: 1.5em;
margin: 0 0 16px 0;
text-align: center;
}

p a
{
color: #000;
text-decoration: none;
}

p a:hover
{
color: #999;
text-decoration: none;
}

p.boxy {
padding: 10px;
background: #f5f5f5;
border: 1px solid #e0e0e0;
}

/* IMAGES */

img.icon {
margin: 0 5px 0 0;
vertical-align: middle;
}

#panel
{
width: 880px;
/*height: 400px;*/
padding: 40px;
text-align: center;
background: #d7d7d7 url(../img/panel-backgr.png) repeat-x;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomleft: 10px;
-webkit-border-bottom-left-radius: 10px;
}

/* MENU STYLE - IGNORE EVERYTHING ABOVE THIS LINE IF YOU WISH */

#menu {
width: 960px;
height: 40px;
clear: both;
}

ul#nav
{
float: left;
width: 960px;
margin: 0;
padding: 0;
list-style: none;
background: #dc0000 url(../img/menu-parent.png) repeat-x;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
}

ul#nav li {
display: inline;
}

ul#nav li a
{
float: right;
font: bold 1.1em arial,verdana,tahoma,sans-serif;
line-height: 40px;
color: #fff;
text-decoration: none;
text-shadow: 1px 1px 1px #880000;
margin: 0;
padding: 0 30px;
background: #dc0000 url(../img/menu-parent.png) repeat-x;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
}

/* APPLIES THE ACTIVE STATE */
ul#nav .current a, ul#nav li:hover > a {
color: #fff;
text-decoration: none;
text-shadow: 1px 1px 1px #330000;
background: #bb0000;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
}

/* THE SUBMENU LIST HIDDEN BY DEFAULT */
ul#nav ul {
display: none;
}

/* WHEN THE FIRST LEVEL MENU ITEM IS HOVERED, THE CHILD MENU APPEARS */
ul#nav li:hover > ul
{
position: absolute;
display: block;
width: 920px;
height: 45px;
position: absolute;
margin: 40px 0 0 0;
background: #aa0000 url(../img/menu-child.png) repeat-x;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomleft: 10px;
-webkit-border-bottom-left-radius: 10px;
}

ul#nav li:hover > ul li a
{
float: right;
font: bold 1.1em arial,verdana,tahoma,sans-serif;
line-height: 45px;
color: #fff;
text-decoration: none;
text-shadow: 1px 1px 1px #110000;
margin: 0;
padding: 0 30px 0 0;
background: #aa0000 url(../img/menu-child.png) repeat-x;
}

ul#nav li:hover > ul li a:hover {
color: #120000;
text-decoration: none;
text-shadow: none;
}
a:link {
color: #006699;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #006699;
}
a:hover {
text-decoration: none;
color: #C98C1D;
}
a:active {
text-decoration: none;
color: #006699;
}

[Mr FTHEL]

body
{
font: normal 85% arial,verdana,tahoma,sans-serif;
color: #777;
margin: 0;
padding: 0;
background: #f0f0f0;
}

#wrapper {
width: 960px;
min-height: 800px;
margin: 20px auto;
padding: 20px;
background: #fff;
border: 1px solid C#‎cc;
overflow: hidden;
}

#top
{
width: 960px;
height: 120px;
background-image: url(../img/banner.jpg);
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomleft: 10px;
-webkit-border-bottom-left-radius: 10px;
}

.line {
width: 960px;
height: 1px;
margin: 40px 0;
background: #ddd;
overflow: hidden;
}

/* TYPOGRAPHY */

h1, h2, h3
{
font-size: 3.5em;
font-weight: normal;
letter-spacing: -1px;
line-height: 1.0em;
color: #000;
margin: 0 0 5px 0;
text-align: center;
}

h2 {
font-size: 2.3em;
letter-spacing: -1px;
color: #999;
margin: 0 0 30px 0;
}

h3
{
font-size: 1.7em;
letter-spacing: 0px;
color: #000;
margin: 70px 0 20px 0;
padding: 0 0 20px 0;
border-bottom: 1px solid #ddd;
text-align: justify;
}

h4 {
font-size: 1.5em;
font-weight: normal;
line-height: 1.1em;
color: #f0f0f0;
margin: 0;
padding: 10px 50px 0 0;
}

p
{
font-size: 1.0em;
line-height: 1.5em;
margin: 0 0 16px 0;
text-align: center;
}

p a
{
color: #000;
text-decoration: none;
}

p a:hover
{
color: #999;
text-decoration: none;
}

p.boxy {
padding: 10px;
background: #f5f5f5;
border: 1px solid #e0e0e0;
}

/* IMAGES */

img.icon {
margin: 0 5px 0 0;
vertical-align: middle;
}

#panel
{
width: 880px;
/*height: 400px;*/
padding: 40px;
text-align: center;
background: #d7d7d7 url(../img/panel-backgr.png) repeat-x;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomleft: 10px;
-webkit-border-bottom-left-radius: 10px;
}

/* MENU STYLE - IGNORE EVERYTHING ABOVE THIS LINE IF YOU WISH */

#menu {
width: 960px;
height: 40px;
clear: both;
}

ul#nav
{
float: left;
width: 960px;
margin: 0;
padding: 0;
list-style: none;
background: #dc0000 url(../img/menu-parent.png) repeat-x;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
}

ul#nav li {
display: inline;
}

ul#nav li a
{
float: right;
font: bold 1.1em arial,verdana,tahoma,sans-serif;
line-height: 40px;
color: #fff;
text-decoration: none;
text-shadow: 1px 1px 1px #880000;
margin: 0;
padding: 0 30px;
background: #dc0000 url(../img/menu-parent.png) repeat-x;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
}

/* APPLIES THE ACTIVE STATE */
ul#nav .current a, ul#nav li:hover > a {
color: #fff;
text-decoration: none;
text-shadow: 1px 1px 1px #330000;
background: #bb0000;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
}

/* THE SUBMENU LIST HIDDEN BY DEFAULT */
ul#nav ul {
display: none;
}

/* WHEN THE FIRST LEVEL MENU ITEM IS HOVERED, THE CHILD MENU APPEARS */
ul#nav li:hover > ul
{
position: absolute;
display: block;
width: 920px;
height: 45px;
position: absolute;
margin: 40px 0 0 0;
background: #aa0000 url(../img/menu-child.png) repeat-x;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomleft: 10px;
-webkit-border-bottom-left-radius: 10px;
}

ul#nav li:hover > ul li a
{
float: right;
font: bold 1.1em arial,verdana,tahoma,sans-serif;
line-height: 45px;
color: #fff;
text-decoration: none;
text-shadow: 1px 1px 1px #110000;
margin: 0;
padding: 0 30px 0 0;
background: #aa0000 url(../img/menu-child.png) repeat-x;
}

ul#nav li:hover > ul li a:hover {
color: #120000;
text-decoration: none;
text-shadow: none;
}
a:link {
color: #006699;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #006699;
}
a:hover {
text-decoration: none;
color: C#‎98C1D;
}
a:active {
text-decoration: none;
color: #006699;
}

فقط هدر مشکل داره؟
لینک عکسو هم کامل بزار

[alibaghi]

#top
{
background-position: center bottom;
width: 960px;
height: 120px;
background-image: url('http://www.mysite.com/img/banner.jpg');
background-repeat: no-repeat;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomleft: 10px;
-webkit-border-bottom-left-radius: 10px;
}

باز هم در IE عکس نمایش داده نمیشه
نمی دونم مشکل از کجاست ؟؟؟؟؟!!!

[Mr FTHEL]

شاید مشکل از عکست باشه اما اگه اینطوری بنویسی IE نشون میده


.logo {
background: #658AB4 url(URL) ;

height: 200px;
width: 970px;
}

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

[alibaghi]

این صفحه روی هاست گذاشتم

www.irmab.somee.com

با همه مرورگرها خوبه ولی با IE مشکل داره و عکس بالا رو نمایش نمیده !
یه مشکل دیگه هست اینکه در بعضی مرورگرها در کامپیوتر های دیگه تست کردم زیر منوها باز نمی شد ؟؟؟!!
کد css بالا گذاشتم
لطفاً کمک کنید

[Mr FTHEL]

ببین مشکل از عکست هست جای دیگه آپلود کن چک کن ببین درست میشه
www.uploadfa.net آپلود کن ببین درست میشه آخه توی ie عکستو نمیشناسه

[alibaghi]

انجام دادم باز هم نشد !
این فایل برنامه کمک کنید لطفاً !

[Mr FTHEL]

عزیز این لینک رو بزار بجاش درست میشه ;) جای عکست


http://uploadfa.net/1389/gtc0506f97my5ddbau.jpg

[Mr FTHEL]

اینم فایلی که دادی درست شد

[alibaghi]

سلام خیلی خیلی ممنون
فقط چی کار کردی میشه بگی ؟
عکس رو فکر کنم عرضشو 1 زیاد کردی !
بعد هم یه عکس دیگه اپلود میکنم آدرسشو می زاره دو باره نشون نمیده ؟
چرا تو هاست خودش که میزارم لینک میده نمیاد ؟
ممنون

[Mr FTHEL]

خوب مشکل از هاستت هست
پسوند فایل هارو دستی عوض میکنی؟

[alibaghi]

خوب مشکل از هاستت هست
پسوند فایل هارو دستی عوض میکنی؟
میشه بیشتر توضیح بدی که از اونجا که هاست خریدم بگم !
در ضمن من یه عکس دیگه توی http://uploadfa.net/ آپلود کردم اما باز نشون نمیده .
عکس باید چیکار کنم
خیلی ممنون میشم اگه راهنمایی کنید
لطف میکنید

[alibaghi]

مشکل از هاست نبود !
مشکل رو پیدا کردم
اگه color mode: cmyk color باشه نشون نمیده اما اگه به RGB تغییر بدی درست میشه
:تشویق::چشمک:
ممنون از همه

[Mr FTHEL]

میشه بیشتر توضیح بدی که از اونجا که هاست خریدم بگم !
در ضمن من یه عکس دیگه توی http://uploadfa.net/ آپلود کردم اما باز نشون نمیده .
عکس باید چیکار کنم
خیلی ممنون میشم اگه راهنمایی کنید
لطف میکنید
اما کلا گاهی اوقات هم هست که به خاطر طولانی بودن نام فایل حجم زیاد و... این اتفاقات میوفته اما ممنون که گفتید ما هم فهمیدیم :چشمک:

[alibaghi]

نمی دونم این دیگه چه مشکلی شل کن سفت کن ؟
با 7 IE کار میکنه با IE8 کار نمیکنه؟
واقعا موندم چی بگم ؟

[Mr FTHEL]

اما اون عکس که دادم با همش کار میکنه درسته؟

[alibaghi]

اگه کار میکنه چون من تست نکردم ! می تونی لطف کنی بگی عکس چیکار کردی که با همه IE می آید

[Mr FTHEL]

ببین یه کاره دیگه هم میتونی بکنی :لبخند:
عکسو باز کن بعد ازش عکس بگیر بعد تو پینت بیار درست میشه:چشمک:

[alibaghi]

یاد رفته بود بگم :

نمی دونم این دیگه چه مشکلی شل کن سفت کن ؟
با 7 IE کار میکنه با IE8 کار نمیکنه؟
واقعا موندم چی بگم ؟

منظور از این که مشکل داره بعد از آپلود روی هاست واقعی در IE 7 کار میکنه ولی در IE8 کار نمیکنه در صورتی روی خود کامپیوتر وقتی اجرا میکنه با همشون نشون میده !

کار شما هم انجام دادم روی کامپیوتر در همه IE نشون میده ولی روی هاست با IE8 مشکل داره نشون نمیده ! خیلی ممنون

عکس حتی در www.uploadfa.net اپلود کردم باز هم نمیاره ؟؟!

خستم کرده :عصبانی:

[webpower]

یاد رفته بود بگم :


منظور از این که مشکل داره بعد از آپلود روی هاست واقعی در IE 7 کار میکنه ولی در IE8 کار نمیکنه در صورتی روی خود کامپیوتر وقتی اجرا میکنه با همشون نشون میده !

کار شما هم انجام دادم روی کامپیوتر در همه IE نشون میده ولی روی هاست با IE8 مشکل داره نشون نمیده ! خیلی ممنون

عکس حتی در www.uploadfa.net (http://www.uploadfa.net) اپلود کردم باز هم نمیاره ؟؟!

خستم کرده :عصبانی:
شاید مشکل از مرورگر خودتونه روی کامپیوتر های دیگه امتحان کردید؟؟

[Mr FTHEL]

یاد رفته بود بگم :


منظور از این که مشکل داره بعد از آپلود روی هاست واقعی در IE 7 کار میکنه ولی در IE8 کار نمیکنه در صورتی روی خود کامپیوتر وقتی اجرا میکنه با همشون نشون میده !

کار شما هم انجام دادم روی کامپیوتر در همه IE نشون میده ولی روی هاست با IE8 مشکل داره نشون نمیده ! خیلی ممنون

عکس حتی در www.uploadfa.net (http://www.uploadfa.net) اپلود کردم باز هم نمیاره ؟؟!

خستم کرده :عصبانی:
عکس رو روی آپلود فا آپلود کن بده چک کنم:چشمک:

[alibaghi]

شاید مشکل از مرورگر خودتونه روی کامپیوتر های دیگه امتحان کردید؟؟
مگه میشه با IE8 روی هاست لوکال کار کنه بعد روی هاست واقعی که می زاریه با IE8 کار نکنه ؟؟
این آدرس عکس در آپلود فا :
http://uploadfa.net/1389/hncxfevl9qkzjfmq9p1v.jpg

[Mr FTHEL]

عکسرو ببین

[alibaghi]

اینجوری می تونی عکس ببینی تنها !
ولی وقتی لینک تو سایت میزارم نشون نمیده تو IE

[Mr FTHEL]

عکس رو ضمیمه کردم

[alibaghi]

پس حتماً مشکل از IE من :متفکر:

[Mr FTHEL]

احتمالا آره:d

[mlf_mlv]

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

#page{ position:absolute; top:200px; right:218px; width:750px; height:500px;background-image:url(../images/page.jpg); background-repeat:repeat-y}
#menu{ background-image:url(../images/menu.jpg); background-repeat:repeat-x; position:absolute; right:218px; top:200px; width:750px; height:30px}menu لود می شه ولی page نه! جالبه، اگه آدرس عکس page رو به menu تغییر بدم درست می شه.
از نظر عکس هم خیالتون راحت، توی ادرس بار آدرسشو می زنم عکس page لود می شه، ولی توی صفحه اصلیم نه.
توی css، تو url آدرس کامل هم نوشتم نشد.
در ضمن، نه تو host جواب می ده نه local
آخرین نکته هم اینکه مشکلم فقط فقط با IE هست

[Mr FTHEL]

اگر ممکن هست ان عکس هایی رو که میارید اینجا بزارید تا اوکی بشه:چشمک:

[mlf_mlv]

اگر ممکن هست ان عکس هایی رو که میارید اینجا بزارید تا اوکی بشه:چشمک:
مگه در چه شرایطی عکس لود نمی شه؟ عکس باید چه شرایطی داشته باشه؟

[Mr FTHEL]

مگه در چه شرایطی عکس لود نمی شه؟ عکس باید چه شرایطی داشته باشه؟
گاهی اوقات اسم طولانی عکس یا حجم بالا و ... گاهی هم سرعت اینترینت هست که عکس رو باز نمیکنه اما در کل اگر باشه بهتر میشه قضاوت کرد

[mlf_mlv]

اسمش که کوتاست. عکس رو آپلود کردم.
http://burden.persiangig.com/document/page.jpg

[Mr FTHEL]

مشکلی نبود که کار میکنه فقط چون مثل همه عکس ها روی هم میاد