superlegga: Unsichtbare Links vor einem Hintergrund

Beitrag lesen

Hallo liebe Community,

Ich bin neu in der HTML/CSS Programmierung und kämpfe schon seit 2 Tagen mit folgendem Problem:

Ich habe eine Website mit einem Hintergrundbild das sich an die Größe des Browser-Fensters skaliert.
Nun würde ich gerne 50% der Breite und 100% der Höhe mit einem Link belegen und der 2. Link soll die restlichen 50% Breite mit 100% Höhe belegen.

Also eigentlich eine Tabelle mit 2 Spalten über das Hintergrundbild legen die sich automatisch mit-skaliert.

Die Tabelle hab ich schon geschaffen, aber wenn ich jetzt klicke passiert gar nichts.

<html>  
<head>  
<title>FabryArt</title>  
<style type="text/css">  
  <!--  
* { margin: 0;  
    padding: 0;}  
  
/* Höhen- und Breitenanpassung zu 100%; Scrollbar ausblenden */  
body, html{ width: 100%;  
            height: 100%;  
            overflow: hidden;}  
  
/* BG-Image auf unterste Ebene anordnen */  
#bgImg{ position: absolute;  
        top: 0;  
        left: 0;  
        border: 0;  
        z-index: 1;}  
/* Body-Dummy absolut über BG-Image legen; Scrollbar bei Bedarf einblenden */  
#bodyDiv{ position: absolute;  
          top: 0;  
          left: 0;  
          z-index: 2;  
          overflow: auto;  
          width: 100%;  
          height: 100%;  
          text-align: center;}  
  
/* Layoutelemente */  
#mainDiv{ width: 600px;  
          height: 100px;  
          text-align: left;  
          margin: 18px auto;}  
#headDiv{ border: 1px solid #000;  
          background: #efefef;}  
#contentDiv{ border: 1px solid #000;  
             background: #f0fff0;  
             margin-top: 6px;  
             height: 1000px;}  
#footerDiv{ border: 1px solid #000;  
            background: #fffff0;  
            margin-top: 6px;}  
 //-->  
</style>  
</head>  
<body>  
<img id="bgImg" src="/images/Startbild.jpg" width="100%" height="100%">  
  
	  
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0" style="table-layout:fixed">  
<tr>  
	<td class="link"  width="50%" height="100%"><a href="http://kay.fabryart.de/index.php"style="display:block">&nbsp;</a></td>  
	  
	<td class="link"  width="50%" height="100%"><a href="http://marius.fabryart.de/index.php"style="display:block">&nbsp;</a></td>  
</tr>  
</table>  
</body>  
</html>