Frågan 5 jan. 2006 16:09 #1 Hej!
Har slitit mitt hår nu ett tag och hittar inte var felet ligger... Allt funkar klockrent i firefox men inte i IE såklart....
Jag har två menyer, på huvudmenyn funkar background-image: url(../images/bg_meny.gif); på både IE och firefox
MEN inte på undermenyn på IE, allt är fint i firefox.
Jag kan inte förstå varför IE inte vill visa bakgrundsbilden på hover när den visar den på det markerade valet...
Det funkade för ett par dagar sen, sen har jag ändrat lite i css:en så jag antar att det är nåt litet som jag inte ser men ändå, varför funkar det då i Firefox?
Det lustiga är att koden är exakt samma:
För huvudmenyns hover:
.menuElementLink:hover {
background-image: url(../images/bg_meny.gif);
color: #ffffff;
text-decoration: none;
}
för undermenyns hover:
.menuElementLinkSub:hover {
background-image: url(../images/bg_meny.gif);
color: #ffffff;
text-decoration: none;
}
Sidan hittar ni på
http://test.tanneforsif.com/default.asp?p=23
den sidan innehåller både huvud- och undermeny.
Tack på förhand!
Här är hela css:en:
/* nollställ marginaler och indrag för alla element - inklusive listor
Läs t.ex. [url]http://www.clagnut.com/blog/1287/[/url] om du inte sett denna förr */
* {margin:0;padding:0;}
/* Grundinställningar för visningsytan no-repeat center fixed; */
html,body {
color: #000;
background: #fff url(../images/bakgrund_logga6.jpg);
height:100%; /* se till att vi kan utnyttja hela visningsytan */
text-align:center; /* centrera #container a'la bluerobot.com del 1 */
}
p {
font-family: verdana, helvetica, sans-serif;
font-size: 12px; line-height: 18px;
color: #000; background-color:transparent;
padding: 0px 5px 10px 0px;
}
#container {
width:766px; /* innehållets totala bredd */
min-height:100%; /* ta upp hela sidan (se MISIE-hack nedan) */
background-image: url(../images/bg_main.gif); /* Se alistapart.com "faux columns" */
margin:0 auto; /* centrera #container a'la bluerobot.com del 2 */
text-align: left; /* ... och del 3 */
}
#header1 {
height: 53px;
background-color:#ccc;
background-image: url(../images/top_tanneforsif.gif);
TEXT-ALIGN: right;
FONT: 10px verdana, arial, helvetica, sans-serif;
color: #333333;
}
#header1 a {
COLOR: #990000;
text-decoration: none;
}
#header1 a:hover {
TEXT-DECORATION: none;
COLOR: #ffffff;
BACKGROUND-COLOR: #6699CC;
}
#header2{
height: 165px;
background-color:#990000;
background-image: url(../images/toplogo.jpg);
}
#menu {
height: 25px;
background-image: url(../images/menytop_2.gif);
}
/* tvåspaltad lösning a'la realworldstyle.com del 2*/
#main {
width:526px; /* width+margin-left skall vara < width på #container, med marginal */
float:left;
font-family: verdana, helvetica, sans-serif;
font-size: 12px; line-height: 18px;
background-color:transparent;
margin-left:7px;
margin-top:14px;
}
#main img {
border:0px solid #dddddd;
margin:0;
padding:0;
}
#main a {
COLOR: #990000;
text-decoration: none;
border-bottom: 1px dotted #6699CC;
}
#main a:hover {
TEXT-DECORATION: none;
border-bottom: 1px solid #6699CC;
COLOR: #6699CC;
BACKGROUND-COLOR: #FFFFFF;
}
/* tvåspaltad lösning a'la realworldstyle.com del 1 line-height: 1.4;*/
#sidebar {
width:220px; /* skall vara mindre än margin-left på #main (med marginal) */
margin-left:536px; /* något mer än bredden på #sidebar */
margin-top:5px;
}
#sidebar HR {
height: 0;
border: 0px;
border-bottom: 1px solid #FFF;
width: 50%;
margin: auto;
*margin: 0px; /* ignoreras av firefox */
padding: 0px;
text-align: center;
}
/* sidfotsmek */
#belowthebottom {
height:35px; /* samma som #bottom */
clear:both;
}
#bottom{
width:766px;
height: 35px; /* height = p height + p margin-top + p margin-bottom */
background-color:#990000;
background-image: url(../images/footer.gif);
margin-top:-35px; /* samma som height */
margin-left:auto;
margin-right:auto;
TEXT-ALIGN: center;
FONT: 10px verdana, arial, helvetica, sans-serif; line-height: 10px;
color: #cccccc;
}
#bottom a {
COLOR: #cccccc;
text-decoration: none;
}
#bottom a:hover {
TEXT-DECORATION: none;
COLOR: #6699CC;
BACKGROUND-COLOR: #FFFFFF;
}
#homeclick {
display:block;
bottom:0; left: 0;
width: 766px;
height: 165px;
}
#homeclick a {
text-decoration: none;
BACKGROUND-COLOR: none;
}
#homeclick a:hover {
TEXT-DECORATION: none;
BACKGROUND-COLOR: none;
}
/*##############################
* Style för omarkerat huvudmenyval background-color: #CC0000;
*##############################
*/
.menuElementLink {
margin-left: 3px;
list-style: none;
display: inline;
color: #ffffff;
padding: 1px 8px 1px 8px;
text-decoration: none;
FONT: 11px verdana, arial, helvetica, sans-serif;
}
.menuElementLink:hover {
background-image: url(../images/bg_meny.gif);
color: #ffffff;
text-decoration: none;
}
/*##############################
* Style för markerat huvudmenyval background-color: #ffffff;
*##############################
*/
.menuElementLinkWhite {
margin-left: 3px;
list-style: none;
display: inline;
background-image: url(../images/bg_meny.gif);
color: #ffffff;
padding: 1px 8px 1px 8px;
text-decoration: none;
BORDER: #660000 2px solid;
FONT: 11px verdana, arial, helvetica, sans-serif;
}
.menuElementLinkWhite:hover {
text-decoration: none;
}
/*##############################
* Style för omarkerat undermenyval
*##############################
*/
.menuElementLinkSub {
list-style: none;
display: inline;
color: #000000;
padding: 1px 8px 1px 8px;
text-decoration: none;
FONT: 11px verdana, arial, helvetica, sans-serif;
margin-left: 35px;
}
.menuElementLinkSub:hover {
background-image: url(../images/bg_meny.gif);
color: #ffffff;
text-decoration: none;
}
/*##############################
* Style för markerat undermenyval padding: 1px 8px 1px 8px;
*##############################
*/
.menuElementLinkWhiteSub {
color: #ffffff;
padding: 1px 8px 1px 8px;
text-decoration: none;
FONT: 11px verdana, arial, helvetica, sans-serif;
font-weight: normal;
background-image: url(../images/bg_meny.gif);
BORDER: #660000 2px solid;
margin-left: 35px;
}
.menuElementLinkWhiteSub:hover {
background-image: url(../images/bg_meny.gif);
color: #ffffff;
text-decoration: none;
}
.jiwebForm {
FONT: 11px trebuchet ms, arial, helvetica, sans-serif;
}
.jiwebButtons {
FONT: 11px trebuchet ms, arial, helvetica, sans-serif;
}
H1 {
PADDING: 0px 0px 0px 0px;
FONT-WEIGHT: normal;
MARGIN: 5px 0px 15px 0px;
COLOR: #990000;
FONT-SIZE: 22px;
FONT-FAMILY: verdana, arial, helvetica, sans-serif;
LINE-HEIGHT: 24px;
}
H2 {
PADDING: 0px 0px 0px 0px;
FONT: 18px verdana, arial, helvetica, sans-serif;
FONT-WEIGHT: normal;
MARGIN: 0px 0px 0px 0px;
COLOR: #990000;
FONT-FAMILY: verdana, arial, helvetica, sans-serif;
LINE-HEIGHT: 24px;
}