Homepage selbermachen 7.851 Themen, 35.615 Beiträge

CMS - MenüButtons in Netscape, Firefox und Opera beschnitten!

Magicmaster_nbb / 9 Antworten / Flachansicht Nickles

Hallo,

folgendes Problem:
ich habe ein Mainmenu, bei dem die Menüpunkte mit einem
Bild hinterlegt sind. Besser gesagt zwei, da ein rollover
besteht. Damit ihr wisst wovon ich rede:

.mainlevel {
letter-spacing : 0px;
padding-left : 15px;
width : 160;
line-height : 22px;
border : 3px solid #FFFFFF;
}

a.mainlevel:link, a.mainlevel:visited {
color : #000000;
background : url('../images/icon01.gif');
font-weight : bold;
background-repeat: no-repeat;
}

a.mainlevel:hover {
color : #FFFFFF;
background : url('../images/icon02.gif');
font-weight : bold;
background-repeat: no-repeat;
}

Mein Problem besteht darin, dass der IE alles perfekt
anzeigt, Netscape, Firefox und Opera mir aber die
Hintergrundbilder des Menüs genau auf die rechte und untere
Kante des Textes beschneiden!
Habe auch schon versucht die Länge und Breite der Bilder
anzugeben. Ändert sich aber nichts!

Hoffe mir kann jemand helfen!

bei Antwort benachrichtigen
Magicmaster_nbb xafford „Soso, Du hast es hinbekommen... wie hast Du das denn gemacht?“
Optionen

Eigentlich schon so wie Du es vorgeschlagen hast!
Nur hat es bei den Untermenüs nicht funktioniert.
Daher habe ich jetzt bei den Untermenüs die Buttons
weggelassen! So sieht´s jetzt in meiner CSS-Datei aus:

.mainlevel {
letter-spacing : 0px;
padding-left : 15px;
width : 160;
line-height : 20px;
border : 3px solid #FFFFFF;
}

a.mainlevel:link {
display : block;
width : 160px;
height : 20px
position : static;
background-image : url('../images/icon01.gif');
color : #000000;
font-weight : bold;
background-repeat: no-repeat;
}

a.mainlevel:visited {
display : block;
width : 160px;
height : 20px
position : static;
background-image : url('../images/icon01.gif');
color : #000000;
font-weight : bold;
background-repeat: no-repeat;
}

a.mainlevel:hover {
display : block;
width : 160px;
height : 20px
position : static;
background-image : url('../images/icon02.gif');
color : #FFFFFF;
font-weight : bold;
background-repeat: no-repeat;
}

.sublevel {
letter-spacing : 0px;
padding-left : 15px;
width : 110;
line-height : 17px;
border : 3px solid #FFFFFF;
}

a.sublevel:link, a.sublevel:visited {
width : 143px;
height : 20px;
position : static;
color : #000000;
font-weight : bold;
background-repeat: no-repeat;
}

a.sublevel:hover {
width : 143px;
height : 20px
position : static;
color : #7ea3ff;
font-weight : bold;
background-repeat: no-repeat;


Also wie gesagt...Danke!

Bis zum nächsten Mal...

bei Antwort benachrichtigen