Problem mit firefox

[erase]

hallo,

Ich will fur mein Menue einen 'Hover effekt' benutzen. Im Internet Explorer sieht alles so aus wie es soll aber im Firefox wird garnichts angezeigt.

Was mich schon gewundert hat da bei mir normalerweise immer die probleme im IE sind

Hier ist der code, ich hoffe mir kann jemand weiterhelfen

CSS:
.menu1:link, .menu1:visited {
display: inline;
width: 102;
height: 52;
background: url(butt_1.jpg);
}
.menu1:hover, .menu1:active, .menu1:focus {
background-image: url(butt_blue_1.jpg);
}

HTML:
<a href="#" class="menu1"></a>

 

[theHacker]

102 Äpfel breit und 52 Bratwürste hoch?

Abgesehen davon gibt es keinen Inhalt darzustellen (is ja nix zwischen den Tags). Stell auf "block", wenn du die Größenangaben wirklich haben willst, obwohl sie nicht gebraucht werden.

(Keinen Anspruch auf Richtigkeit, habs nicht ausprobiert)

 

[erase]

Ok wenn ich es auf 'block' stelle wird es angezeigt, aber eigentlich will ich die menuepunkte nebeneinander anzeigen lassen, was meines wissens mit dem 'block' Element nicht moeglich ist?

verbesser mich wenn ich falsch liege...

 

[theHacker]

Richtig. Aber dann benutzt du die Eigenschaft float um es trotzdem wieder nebeneinander hinzukriegen.

 

[erase]

Ahh das ist clever. Aber eine Frage noch hinterher. Ist das sauberer und valider code wenn ich es so schreibe da ich ja das block element ausser gefecht setze?

 

[theHacker]

Anders kannst du es ja nicht machen.
Sauberkeit richtet sich daran, ob du ordentlich strukturierst. Es geht um eine Navigation.

Falsch wäre also:

<p>
  <a href="#">Link 1</a><br />
  <a href="#">Link 2</a><br />
  <a href="#">Link 3</a>
</p>

Sauber ist es, wenn du deutlich machst, dass das kein Textabsatz ist, sondern eine Aufzählung (von Navigationspunkten), also richtig:

<ul>
  <li><a href="#">Link 1</a></li>
  <li><a href="#">Link 2</a></li>
  <li><a href="#">Link 3</a></li>
</ul>

Und zur Validität kann man es noch kürzer halten: Hältst du dich an die DTD, auf die du dich im DOCTYPE beziehst, ist die Seite valide. Tust du das nicht, läufst du Gefahr, dass ein Browser sie nicht/nicht richtig anzeigt.

edit:
Ich geb dir noch nen Link mit auf den Weg.
https://www.cssplay.co.uk/menus/index

Guck dich da mal um, was du alles mit CSS rausholen kannst.