img-Button funktioniert im IE aber net im Firefox

Status
Nicht offen für weitere Antworten.

kadjarda

Grünschnabel
Hi Leute!

vielleicht könnt ihr mir helfen:
Ich hab mit css einen button mit gebaut, der ganz famos im IE funktioniert, aber leider nicht im Firefox... da läd er das Bild einfach nicht - die Stelle ansich ist definitiv ein link und "verlinkt" auch - aber das bild ist halt nicht zusehen! Hat da jmd. nen Lösungsvorschlag?

Hier mal der css-tag meines buttons; das bild liegt selbstverständlich im richtigen ordner!:

Code:
ul#Navigation{
	background-color:#000000;
	padding:0;
	margin:0;
}


ul#Navigation li {

 	
	list-style: none;
    	display: inline;
    	
	

  }


a.buttonich
{ text-decoration:none;

background-image:url(ich02.gif);
width:98px; height:47px;
}


a.buttonich:link,visited,active {

background-image:url(ich02.gif);
width:98px; height:47px;
}


a.buttonich:hover {

background-image:url(ich01.gif);
}

und dann in HTML:

Code:
<ul id="Navigation">
  <li>
    <a href="ich.htm" class="buttonich">&nbsp;</a></li>
</ul>

Wäre um Hilfe dankbar!

kadjarda
 
Warum machst Du Dir es denn so kompliziert?
Das kannst Du doch viel einfacher haben:
HTML:
<ul id="Navigation">
  <li>
    <input type="image" src="ich02.gif" alt="Absenden" class="buttonich" />
  </li>
</ul>
Und der CSS Code:
Code:
ul#Navigation
{
  background-color:#000000;
  padding:0;
  margin:0;
}
ul#Navigation li 
{
  list-style: none;
  display: inline;
}
.buttonich
{
  border: 0px;
}
Das sollte funktionieren!

redlama
 
Oh, entschuldige, das hatte ich überlesen, ...
Dann sollte es aber so funktionieren:
Code:
.buttonich
{
  display: block;
  width: 98px;
  height: 47px;
  background: url(http://web4.web20.isuma.de/images/fuss1.gif);
}
.buttonich:hover
{
  background-image: url(http://web4.web20.isuma.de/images/fuss2.gif);
}
HTML:
<ul id="Navigation">
  <li>
    <a href="" class="buttonich">
  </li>
</ul>

redlama
 
prima! Der rollover funktioniert schonmal ganz gut..... Toll, danke! :p
jetzt isses aber noch so, daß ich mehrere button hintereinander anordnen will - mittig... deswegen hab ich das überhaupt mit <li> gemacht..
leider positionieren sich diese buttons wenn ich sie dann hintereinander lagere aber 1.untereinander und 2.am linken rand und nicht inner mitte...
will ja nebeneinander und mittig! dachte erst an display:float; aber des geht net.

haste da auch noch n tipp? :)
 
mittig hab ich gerade durch

.buttonich
{
text-align:center;

schon erreicht.
Aber des hintereinander noch net....
 
Also was das mittige anordnen betrifft, da habe ich auch öfters Probleme mit.
Aber was ich mich gerade frage ist, ob Du dir bewusst bist, dass <li> in Verbindung mit <ul> für Aufzählungslisten zuständig ist! Du wirst also immer die Werte untereinander haben!
Du kannst doch aber das ganze in ein <div> legen und dann einfach die Links nebeneinander packen und wenn Du nur den Punkt davor haben willst, den kriegt man auch mit &bull; (siehe HTML-Zeichereferenz).

redlama

P.S. Achte bitte auf Deine Groß-/Kleinschreibung, darauf wird hier auf tutorials.de sehr viel Wert gelegt (siehe Netiquette).
 
Das mit dem Aufzählungslisten wusste ich schon.
Ich dachte nur, dass ich das dann leichter "anordnen" könnte.
Aber wie kann ich denn <div>s hintereinanderlegen?
Ich bekomme die auch immer nur untereinander?
 
Man kann Div's schon nebeneinander legen, mit float:left sollte das gehen.
Du kannst doch aber auch alle Links in ein und dem selben Div liegen haben. Da brauchst Du doch nur die Grafiken nebeneinander (evtl. mit &nbsp; oder wie auch immer getrennt) legen.
Oder habe ich Dich falsch verstanden?

redlama
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück