<a> und <form> funktionieren nicht

Status
Nicht offen für weitere Antworten.

Kopfballstar

Erfahrenes Mitglied
Hallo,

foilgendes Problem. Auf meiner Site funktionieren die <a> Tags und die <form> nicht. In der Praxis bedeutet das: Ich fahre über einen Link aber kann ihn nicht klicken. [ Beim Menü klappt es aber komischerweise ].
Genau so ist es mit dem <form> Tag. Ich versuche in ein Feld zu klicken um einen Text einzugeben, aber ich kann da nicht reinklicken.

Hat jemand eine Idee wie so etwas passieren kann?
 
Wenn du den dazugehörigen Quelltext (HTML, CSS) zeigst, können wir der Sache auf den Grund gehen.
 
Ist n bisschen blöd formatiert weil ein Teil per php included wird.

HTML:
	<body>
		<div>

			<div id="content"  style="position:absolute; left:208px; top:200px; width:400px; height:350px;" z-index="1">

			    <div id="main_text" z-index="1"> 

			      
	<br><br><br><br>
	Schreibt mir! Los los....
	<br><br>
 

		<form action="main.php?section=contact" method="post"> 
			<table border="0" cellspacing="0" cellpadding="0" width=100%> 
				<tr>
					<td nowrap align="right">Dein Name:</td>
					<td>&nbsp;</td> 
					<td width="100%"><input type="text" name="fromname" size="50" maxlength="120" value=""></td>
				</tr> 
			
				<tr>
					<td nowrap align="right">Deine E-Mail Adresse:</td>
					<td></td> 
					<td width="100%"><input type="text" name="frommail" size="50" maxlength="120" value=""></td>
				</tr> 
			
				<tr>
					<td nowrap align="right">Betreff:</td>
					<td></td> 
					<td width="100%"><input type="text" name="mailsubject" size="50" maxlength="120" value=""></td>
				</tr> 
			
				<tr>
					<td nowrap align="right" valign="top">Text:<br><i>(max. 1.000 Zeichen)</i></td>
					<td></td> 
					<td width="100%"><textarea cols="40" rows="10" name="mailtext"></textarea></td>
				</tr> 
			
				<tr>
					<td></td>
					<td></td>
					<td>
						<input type="hidden" value="1" name="s"> 
						<input type="submit" value="Nachricht versenden" name="submit"> 
					</td>
				</tr> 
			</table> 
		</form> 

				
			    </div>
	
			</div>

			<div id="background" style="position:absolute; left:0px; top:0px; width:800px; height:600px;" z-index="2">
	
				
		<table align='left'  valign='top' cellpadding='0' cellspacing='0' width='800' height='600' >
			<tr>
				<td style='background-image:url(images_main/11.gif)' width='200' height='150'></td>
				<td style='background-image:url(images_main/12.gif)' width='200' height='150'></td>
				<td style='background-image:url(images_main/13.gif)' width='200' height='150'></td>
				<td style='background-image:url(images_main/14.gif)' width='200' height='150'></td>
			</tr>
			<tr>
				<td style='background-image:url(images_main/21.gif)' width='200' height='150'></td>
				<td style='background-image:url(images_main/22.gif)' width='200' height='150'></td>
				<td style='background-image:url(images_main/23.gif)' width='200' height='150'></td>
				<td style='background-image:url(images_main/24.gif)' width='200' height='150'></td>
			</tr>

			<tr>
				<td style='background-image:url(images_main/31.gif)' width='200' height='150'></td>
				<td  width='200' height='150'></td>
				<td style='background-image:url(images_main/33.gif)' width='200' height='150'></td>
				<td style='background-image:url(images_main/34.gif)' width='200' height='150'></td>
			</tr>
			<tr>

				<td style='background-image:url(images_main/41.gif)' width='200' height='150'></td>
				<td style='background-image:url(images_main/42.gif)' width='200' height='150'></td>
				<td style='background-image:url(images_main/43.gif)' width='200' height='150'></td>
				<td style='background-image:url(images_main/44.gif)' width='200' height='150'></td>													
			</tr>
		</table>
		
			</div>
		
			<div id="menu"  style="position:absolute; left:450px; top:80px; width:250px; height:120px;" z-index="3">
	
				<div id="about_div" z-index="4">
<a id="about" href="main.php?section=about"></a>
</div>

<div id="instrumentals_div" z-index="4">
<a id="instrumentals" href="main.php?section=instrumentals"></a>
</div>

<div id="specials_div" z-index="4">
<a id="specials" href="main.php?section=specials"></a>
</div>

<div id="kontakt_div" z-index="4">
<a id="kontakt" href="main.php?section=contact"></a>
</div>		
			</div>	

			<div id="buttons" z-index="3"> 

			    <div id="button_scroll_up" z-index="5"> <a id="up" href="#" onmouseover="scrollitdown()" onmouseout="clearTimeout(timer)"></a> 
			    </div>

			    <div id="button_scroll_down" z-index="5"> <a id="down" href="#" onmouseover="scrollitup()" onmouseout="clearTimeout(timer)"></a> 
		    	</div>

			</div>

		</div>	
	
	</body>
 
Ein HTML-Attribut namens z-index gibt es nicht. Daher werden das Formular und die Links anscheinend vom mittleren DIV (mit der Tabelle) überdeckt.

Füge deshalb mal die CSS-Eigenschaft z-index in den jeweiligen Stylesheet-Angaben ein.
 
Hi.

Er sagte(meinte): Es gibt kein HTML z-index Attribut. Es gibt lediglich eine CSS Eigenschaft namens z-index.

Du mußt den z-index in einem Stylesheet bzw. innerhalb eines style Attributs für ein HTML Element angeben.

Gruß
 
Auch dann ändert sich nichts an der Situation.

// edit

Alles klar, die Ebene wird überdeckt. Das liegt jetzt nicht an der z-index Positionierung in oder außerhalb des Stylesheets sonderne inafch daran das eine Ebene darüber liegt. Kann man das umgehen?
 
Das Problem liesse sich beheben, indem du für das mittlere DIV (top:0, left:0, width:800px, height:600px) einen z-index:1 und für die übrigen DIVs einen höheren z-index-Wert wählst, damit sie darüber liegen. Dann sind sie Links und Formularelemente auch nutzbar ;)
 
michaelsinterface hat gesagt.:
Das Problem liesse sich beheben, indem du für das mittlere DIV (top:0, left:0, width:800px, height:600px) einen z-index:1 und für die übrigen DIVs einen höheren z-index-Wert wählst, damit sie darüber liegen. Dann sind sie Links und Formularelemente auch nutzbar ;)

Ja da hst du recht. Aber das geht leider nicht. Die Ebenen müssen so liegen, das hat designtechnische Hintergründe. Aber egal, wenn es nur so geht dann muss ich die Grafiken einfach anders zurechtschneiden und die Ebene oben in 4 Teile drumherum verteilen.
thx
 
Status
Nicht offen für weitere Antworten.
Zurück