Also es bestehn weiterhin 2 Probleme zudenen sich ein dritter gesellt -.- :
1,wen ich eben irgentwo anderrs hin klicken ist wieder das Alte bild da und der weggemacht Menuteil auch >.<
2,Wenn es an ist und ich drauf Hover misachtet er den
#pulldown1 A:hover #pulldown1 A:active {text-decoration: none; color: #0000C0;background-image: url(./img/Luna/4_Normal_Hover.png);}
Und benutz den Normalen hover für #pulldown1
3.Mozilla ignoriert vom Prinzip das wegseln des bildes sonst klappt alles bei Mozilla richtig o.O
Edit:
Hier der Aktuele Code
HTML-Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title> CSS-Layout 1</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" >
<meta http-equiv="Content-Style-Type" content="text/css" >
<style type="text/css" >
<!--
A {text-decoration: none; color: #0000C0;}
A:visited{text-decoration: none; color: #0000C0;}
A:active{text-decoration: none; color: #0000C0;}
A:hover{text-decoration: underline; color: #0000C0;}
body
{
color :#000000 ;
background-color:#f0f0f0;
font-family : verdana, helvetica, sans-serif;
font-size : 13px;
margin : 0px;
padding:0px;
}
.box3{font-size:10px;padding:0px;border:0px solid black;width:170px;margin:0px;position:absolute; left:5px; top:10px;text-align:center;}
.box4{font-size:10px;padding:0px;margin:0px 0px 0px 0px;border:1px solid black;position:absolute; left:185px; right:185px; top:10px;text-align:center;}
.box5{font-size:10px;padding:0px;border:1px solid black;width:170px;margin:0px;position:absolute; right:5px; top:10px;text-align:center;}
.Menu1
{
font-size:1px;
padding:0px;
border:0px solid black;
width:3px;
margin:0px;
text-align:center;
height:30px;
background-image: url(./Menu01.png);
}
.Menu2
{
font-size:1px;
padding:0px;
border:0px solid black;
width:21px;
margin:0px;
text-align:center;
height:30px;
background-image: url(./Menu02.png);
}
.Menu3
{
font-size:20px;
padding:0px;
padding-left:5px;
border:0px solid black;
margin:0px;
text-align:left;
height:30px;
color:#ffffff;
background-image: url(./Menu03.png);
}
.Menu4
{
font-size:10px;
padding:0px;
border:0px solid black;
width:30px;
margin:0px;
text-align:right;
height:30px;
background-image: url(./Menu04.png);
}
.Menu5
{
font-size:1px;
padding:0px;
border:0px solid black;
width:4px;
margin:0px;
text-align:right;
height:30px;
background-image: url(./Menu05.png);
}
#pulldown1
{
border:0px solid black;
width:21px;
height:21px;
display:block;
}
#pulldown1 A:hover #pulldown1 A:active {text-decoration: none; color: #0000C0;background-image: url(./4_Normal_Hover.png);}
#pulldown1 A:active{text-decoration: none; color: #0000C0;background-image: url(./4_Normal.png);}
#pulldown1 A{text-decoration: none; color: #0000C0;background-image: url(./Normal_.png);}
A:active {text-decoration: none; color: #0000C0;background-image: url(./Normal_.png);}
#pulldown1 A:hover{text-decoration: none; color: #0000C0;background-image: url(./Hover_.png);}
-->
</style>
</head>
<body>
<div class="box3" >
<table cellpadding="0" cellspacing="0" border="0" width="100%" >
<tr>
<td class="Menu1" > </td>
<td class="Menu2" > <img src="./img/logo/Mozilla.png" height="16" width="16" alt="Mozilla Logo" title="Mozilla Logo" /> </td>
<td class="Menu3" > Home</td>
<td class="Menu4" > <div id="pulldown1" > <a href="#p1" id="pulldown1" > </a> </div> </td>
<td class="Menu5" > </td>
</tr>
</table>
</div>
<div class="box4" >
<div style="width:100%;" >
</div>
</div>
</div>
<div class="box5" >
</div>
</body>
</html>