• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

dynamisches Layout

Status
Für weitere Antworten geschlossen.

kroT

Neues Mitglied
Hallo,

Ich habe auf meiner Page homepage.hispeed.ch/Equinox-music versucht ein dynamisches Layout zu erstellen welches sich immer an die Fenstergrösse anpasst. funktionniert eigentlich recht gut, nur dass es mir die Fotos in der oberen Leiste sehr verzerrt. Wie kann ich das verhindern so dass sich die Bilderhöhe an die Breite anpasst? (Die Titelleiste ist aus 6 Bildern zusammengesetzt!)

HTML:
<body>
    <div style="background-color:#040521; height:90%; margin-left:15%; margin-right:15%; margin-top:3%;">
    <div nowrap style="height:29%; width:100%; text-align:right; margin:0px">
		<img src="Bilder/Logo1.jpg" style="width:40.1%"><a href="SBDickli.html"  onclick="PopUp(this.href); return false"><img  
		   border="0" src="Bilder/DickliOFF.gif" style="width:12.3%" onmouseover="this.src='Bilder/DickliON.gif'" onmouseout="this.src='Bilder/DickliOFF.gif'"></a><a href="SBBiiit.html"  onclick="PopUp(this.href); return false"><img 
		   border="0" src="Bilder/BiiitOFF.gif" style="width:8.97%" onmouseover="this.src='Bilder/BiiitON.gif'" onmouseout="this.src='Bilder/BiiitOFF.gif'"></a><a href="SBMatthias.html"  onclick="PopUp(this.href); return false"><img 
			 border="0" src="Bilder/MatthiasOFF.gif" style="width:10.25%" onmouseover="this.src='Bilder/MatthiasON.gif'" onmouseout="this.src='Bilder/MatthiasOFF.gif'"></a><a href="SBKerstin.html"  onclick="PopUp(this.href); return false"><img 
			 border="0" src="Bilder/KerstinOFF.gif" style="width:8.7%" onmouseover="this.src='Bilder/KerstinON.gif'" onmouseout="this.src='Bilder/KerstinOFF.gif'"></a><a href="SBTina.html"  onclick="PopUp(this.href); return false"><img 
			 border="0" src="Bilder/TinaOFF.gif" style="width:9%" onmouseover="this.src='Bilder/TinaON.gif'" onmouseout="this.src='Bilder/TinaOFF.gif'"></a><a href="SBHaeny.html"  onclick="PopUp(this.href); return false"><img 
			 border="0" src="Bilder/HaenyOFF.gif" style="width:10.68%" onmouseover="this.src='Bilder/HaenyON.gif'" onmouseout="this.src='Bilder/HaenyOFF.gif'"></a>
		</div>
				
    <div style="background-color:#424242; height:8%; text-color:white;">
	<table height="100%" width="100%">
		<tr>
		  <td align="center">
        <a href="index.html" class="on" onMouseOver = "className ='off';" onMouseOut = "className = 'on';">News</a>
      </td>
      <td align="center">
				<a href="Tour.html" class="on" onMouseOver = "className ='off';" onMouseOut = "className = 'on';">Tour</a>
      </td>
      <td align="center">
        <a href="Band.html" class="on" onMouseOver = "className ='off';" onMouseOut = "className = 'on';">Band</a>
      </td>
			<td align="center">
        <a href="Sound.html" class="on" onMouseOver = "className ='off';" onMouseOut = "className = 'on';">Sound</a>
      </td>
      <td align="center">
        <a href="Gallery.html" class="on" onMouseOver = "className ='off';" onMouseOut = "className = 'on';">Gallery</a>
      </td>
      <td align="center">
        <a href="http://www.onlinewebservice6.de/gastbuch.php?id=117000" class="on" onMouseOver = "className ='off';" onMouseOut = "className = 'on';">Gästebuch</a>
      </td>
      <td align="center">
        <a href="Kontakt.html" class="on" onMouseOver = "className ='off';" onMouseOut = "className = 'on';">Kontakt</a>
      </td>
		</tr>
	</table>
</div>

<table width="100%" height="63%" cellpadding="10px" style="font-family:trebuchet ms; font-size:15; valign:top;">
<tr style="height:100%">
<td class="haupt">
Eine Newcomerband ...</br>
</td>
</tr>
</table>   
</body>

Danke

Mod-Edit: Bitte [noparse]
HTML:
[/noparse] für HTML- und [noparse]
PHP:
[/noparse] für PHP-Code verwenden...!
(flapo)
 
Zuletzt bearbeitet von einem Moderator:
Indem du ihre breite und höhe nicht veränderst oder nur eine der beiden komponenten damit sie das richtige verhältnis beibehalten.
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben