IE background-image CSS
6 naročnikov
6 naročnikov
Pozdravljeni!
Background-image sem naredil s css gradientom, poleg gradienta je pa v headerju tudi slika. V vseh brskalnikih to lepo deluje razen v IE. Zato sem za IE naredil poseben div kamor sem vstavil header sliko, ki se prikaže le v IE. Sedaj me pa zanima kako to sliko prikazati nad gradientom ter da bo hkrati pod logo in tekstom?
Trenutna css koda je takšna:
body {
font-size: 11px;
color: #5D717E;
text-align: center;
font-family: Arial, Verdana, Helvetica, Sans-Serif, Tahoma;
background-repeat: no-repeat;
background-position: center top;
background-image:url("../img/body_bg.jpg"), linear-gradient(to bottom, #FFCD02 30%,#FEFCEA 100%);
background-image:url("../img/body_bg.jpg"), -moz-linear-gradient(top, #FFCD02 30%, #FEFCEA 100%);
background-image:url("../img/body_bg.jpg"), -webkit-gradient(linear, left top, left bottom, color-stop(30%,#FFCD02), color-stop(100%,#FEFCEA));
background-image:url("../img/body_bg.jpg"), -webkit-linear-gradient(top, #FFCD02 30%,#FEFCEA 100%);
background-image:url("../img/body_bg.jpg"), -o-linear-gradient(top, #FFCD02 30%,#FEFCEA 100%);
background-image:url("../img/body_bg.jpg"), -ms-linear-gradient(top, #FFCD02 30%,#FEFCEA 100%);
background-image:url("../img/body_bg.jpg"), linear-gradient(to bottom, #FFCD02 30%,#FEFCEA 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffcd02', endColorstr='#fefcea',GradientType=0);
}
#bodyIE
{
background-repeat: no-repeat;
background-position: center top;
background-image:url("../img/body_bg.jpg");
height: 249px;
display:block;
}
14 odgovorov
Hvala za pomoč, mi je uspelo tako da sem postavil <div id="bodyIE"></div> pred <div id="header_right"> in nastavil v bodyIE margin-bottom: -250px.
Nastala je nova težava v IE je nastala pod footerjem bela praznina:
V firefoxu je nastal odmik pod menu vrstico:
Nimam ideje zakaj, namreč v Chromu pa deluje normalno. Stran je online, če bo v pomoč: Hiša piva
Seveda, ce imas
#header {
padding-bottom: 90px;
}
Ce to izklopim, je v FF13 odmika manj. Enako v IE8.
V IE8 beline pod footerjem pri meni ni.