✔ Browserproblem - IE6 - IE7

Status
Nicht offen für weitere Antworten.
N

napsi

Erfahrenes Mitglied
Hallo!

Mein Problem mit den Browsern:

Ich habe folgendes Problem:
Im IE7, Firefox,... ist die Darstellung so, wie es gehört
Im IE6 funktioniert die Seite allerdings nicht so, wie es sein soll. Der <span> wird hier nicht ausgeführt, d.h. das Bild wird nicht sichbar, wenn man mit der Maus über "Foto" fährt:

Es handelt sich um folgende Seite:
http://www.uehv-hawks.at

Ich habe hierfür folgenden Code verwendet:

HTML: 
		<div id="content">
			<h1>Kampfmannschaft</h1>
		  	<table border="0" class="table_elements">
            <tr  bgcolor="#BF4038">
              <th width="10" scope="col"><span class="Stil1">Nr.</span></th>
              <th width="250" scope="col"><div align="left"><span class="Stil1">Name</span></div></th>
              <th width="80" scope="col"><span class="Stil1">Position</span></th>
			  <th width="20" scope="col"><span class="Stil1">Detail</span></th>
            </tr>
			<tr bgcolor="#FAECEB">
              <td>#30</td>
              <td>Wallner Martin</td>
              <td>Verteidiger</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/wallner.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#33</td>
              <td>Scholler Manuel</td>
              <td>Tormann</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/scholler.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#21 </td>
              <td>Steinhauser Daniel</td>
              <td>C-Stürmer </td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/steinhauser.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#44 </td>
              <td>Treiber Gerhard</td>
              <td>Stürmer</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/treiber.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#55 </td>
              <td>Taibl Sascha</td>
              <td>Verteidiger</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/taibl.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#18  </td>
              <td>Jecel Walter</td>
              <td>Stürmer</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/jecel.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#88</td>
              <td>Schonaklehner Martin</td>
              <td>Verteidiger</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/schonaklehner.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#11</td>
              <td>Schindlegger Erich</td>
              <td>Stürmer</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/schindlegger.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#45 </td>
              <td>Huber Stefanie</td>
              <td>Verteidiger</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/huber.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#49 </td>
              <td>Mlcak Martin</td>
              <td>Stürmer</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/mlcak.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#22 </td>
              <td>Hager Michael</td>
              <td>Stürmer</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/hager.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#99 </td>
              <td>Gössl Rainer</td>
              <td>Stürmer</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/goessl.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#14 </td>
              <td>Zenz Alice</td>
              <td>Stürmer</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/zenz.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#67 </td>
              <td>Smejkal Milos</td>
              <td>Verteidiger</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/milos.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td># </td>
              <td>Nagy Atilla</td>
              <td>Stürmer</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/nagy.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#</td>
              <td>Platzer Wolfgang</td>
              <td>Verteidiger</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/platzer.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#</td>
              <td>Bartos Philipp</td>
              <td>Stürmer</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/bartos.jpg" alt=""></span></td>
            </tr>
			
			<tr bgcolor="#FAECEB">
              <td>#69</td>
              <td>Haas Rene</td>
              <td>Stürmer</td>
			  <td>Foto<span class="info"><img src="Img/Team/Kampfmannschaft/haas.jpg" alt=""></span></td>
            </tr>
			
		</table>

Code: 
td:hover .info {
	padding: 5px 5px 5px 5px;
	border: 1px solid;
	border-color:#BF4038;
	display: block;
	position: absolute;
	top: 225px;
	left:435px;
	z-index: auto;
}

td .info {
	display:none;
}

table {
	margin-left:10px;
	margin-top: 5px;
}

.Stil1 {
	color:#FFFFFF;
}

Das Lustige ist aber, dass ich das selbe bei einer anderen Seite gemacht habe:

http://www.kaschütz.at/gusstechnik.asp

HTML: 
<ul>
<li><a href="#">Gusseisen mit Lamellengraphit (Grauguß) <span class="info">EN-GJL-150<br>EN-GJL - 200<br>EN-GJL - 220<br>EN-GJL - 250<br>EN-GJL - 300<br>nach Bedarf auch mit Chromlegiert (Hitzebeständig)</span></a></li>
<li><a href="#">Gusseisen mit Kugelgraphit (Sphäroguß) <span class="info">EN-GJS - 400<br>EN-GJS - 500<br>EN-GJS - 600<br>EN-GJS - 700<br>nach Bedarf auch mit Chromlegiert (Hitzebeständig)</span></a></li>
<li><a href="#">Stahlguss<span class="info">1.4729<br>1.4776<br>1.4823<br>1.4848<br>Weitere Qualitäten auf Anfrage</span></a></li>
<li><a href="#">Aluminium<span class="info">Qualität auf Anfrage</span></a></li>
<li><a href="#">Bronze<span class="info">Qualität auf Anfrage</span></a></li>
<li><a href="#">Rotguß<span class="info">Qualität auf Anfrage</span></a></li>
<li><a href="#">Messing<span class="info">Qualität auf Anfrage</span></a></li>
<li><a href="#">Schmiedeteile und Presslinge aus Messing<span class="info">Qualität auf Anfrage</span></a></li>
<li><a href="#">Druckgussteile aus Zink und Aluminium<span class="info">Qualität auf Anfrage</span></a></li>
</ul>

Code: 
li:hover .info {
	padding: 5px 5px 5px 5px;
	border: 1px solid;
	display: block;
	position: absolute;
	top: 335px;
	left:720px;
	z-index: auto;
	width: 200px;
}

li .info {
	display:none;
}

li {
	font-family:arial, verdana, sans-serif;
	font-size:10px;
	font-style:normal;
	line-height:18px;
	margin-left:5px;
	margin-right: 5px;
	width:220px;
}

li a:hover {
	text-decoration: underline;
	font-weight:bold;
}

li a .info {
	display: none;
	text-decoration:none;
}

li a:hover .info {
	padding: 5px 5px 5px 5px;
	border: 1px solid;
	display: block;
	position: absolute;
	top: 335px;
	left:720px;
	z-index: auto;
	width: 200px;
}

li a {
	text-decoration:none;
}

wenn man hier über die aufzählungszeilen fährt, kommt der <span> auch im IE6

kann das sein, dass ich eine Tabelle genommen habe, dass es deshalb nicht funktioniert? oder habe ich irgend was übersehen. bitte um info.

danke

lg.

napsi
 
Hi,

der IE6 untersützt die :hover-Pseudoklasse ausschliesslich für Links, also a:hover - zur Erinnerung Mit CSS mouse over machen.

Und nun vergleich mal etwas genauer die angewandten Techniken in den beiden Seiten miteinander, denn das gleiche hast du da nicht gemacht.

mfg Maik
 
Hallo Maik!

Ich habe es auch mit einem link ("#") versucht, wie in der seite kaschütz, funktioniert allerdings auch nicht.

lg.

Napsi
 
Dann zeig mal bitte anhand des HTML- und CSS-Codes, wie du das konkret versucht hast, denn ob der Link nun in einem Listenpunkt oder in einer Tabellenzelle eingebunden ist, spielt für die Funktionalität des "CSS-Popups" keine Rolle.

mfg Maik
 
Maik hat gesagt.:
Dann zeig mal bitte anhand des HTML- und CSS-Codes, wie du das konkret versucht hast
Zum Vergrößern anklicken....
Okay, ich hab deinen erfolglosen Versuch in dem Dokument http://www.mgloop.at/UEHV/kampfmannschaft.asp entdeckt ;-)

Aus:

Code: 
<td>Foto<a href="#"><span class="info"><img src=Img/Team/Kampfmannschaft/wallner.jpg alt=""></span></a></td>

wird:

Code: 
<td><a href="#">Foto<span class="info"><img src=Img/Team/Kampfmannschaft/wallner.jpg alt=""></span></a></td>
Wenn du, wie von mir in meinem ersten Beitrag empfohlen, die angewandten Techniken miteinander verglichen hättest, wäre dir dieser Fehler nicht unterlaufen bzw. hätte dir eigentlich mit einem wachsamen Auge auffallen müssen.

mfg Maik
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück