Fifi: Seite zu groß angezeigt

Beitrag lesen

Hallo!

Und zwar habe ich ein Problem mit der Darstellung von meiner HTML-Seite. Ich möchte, dass die Größe der Seite sich automatisch an den Bildschirm anpasst. Und ich habe auch immer nur relative Größenangaben verwendet.
Zum Beispiel ist die Grundstruktur meiner Seite eine Tabelle, deren Größe ich mit 100% angegeben habe. Allerdings wird die Seite dann im Mozilla Firefox viel zu groß angezeigt. Das komische, in Safari wird sie richtig dargestellt und in meinem HTML-Editor (Coda für MacOS) auch.
Woran kann das liegen?

Hier ein Teil meines Codes:

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html><head><title>Grun&amp;Partner - Home</title>  
  
<meta http-equiv="Content-Style-Type" content="text/css">  
<style type="text/css">  
.gross { font-family:Calibri, Arial; font-size:200%; vertical-align:top; text-align:center; color:#221AB4 }  
.normal { font-family:Calibri, Arial; font-size:100% }  
.klein { font-family:Calibri, Arial; font-size:80% }  
.kursiv { text-decoration: underline; font-weight: bold; font-style: italic; font-family:Calibri, Arial; font-size: 85% }  
.kursiv2 { font-weight: bold; font-style: italic; font-family:Calibri, Arial; font-size: 85% }  
</style>  
</head>  
  
<body>  
    <table bgcolor="#fef8e8" border="0" cellpadding="0" cellspacing="5" width="100%">  
    	  
<!-- ------------------------- Webside Head ----------------------------- -->  
    	<tr>  
    		<td width="25%" align="center"><a href="index.html"><img src="Bilder/UND_Knopf.png" alt="Grun&amp;Partner" border="0" height="100%"></a></td>  
    		  
    		<td width="75%" align="center"><a href="index.html"><img src="Bilder/logo.jpg" alt="Grun&amp;Partner" border="0" height="100%"></a></td>  
    	</tr>  
    	  
    	<tr>  
    	  
<!-- ------------------------- Buttons ----------------------------- -->  
    		<td valign="top" width="20%">  
    		<table width="100%" cellspacing="5">  
    			<tr>  
    				<td><td><p><span class="kursiv2"> &nbsp; <br></span> </p></td>  
    			</tr>  
    			  
    			  
    			  
    			<tr>  
    				<td height="30%"><a href="beratung.html"><img src="buttons/beratung.jpg" alt="Beratung" border="0" height="30%"></a></td>  
    			</tr>  
  

und so weiter. Also ich habe eine große Tabelle und in dieser zwei weitere Tabellen eingebaut. die große zu 100%, die zweite zu 20% (unter "Buttons") und später noch eine weitere (neben der zweiten Tabelle) zu 80%:

  
<!-- ------------------------- Texte ----------------------------- -->  
    		<td valign="top" width="80%">  
    		<table width="100%" cellspacing="5">  
    		  
    		<tr>  
    			<td><p><span class="kursiv"> Im Fokus aller T&auml;tigkeiten stehen...<br></span> </p></td>    			  
    		</tr>  
    		  
    		<tr>  
    			<td align="left"><img src="texte/beratung.jpg" alt="Beratung" border="0" height="30%"></td>  
    		</tr>  
  

Ich wäre euch sehr verbunden, wenn ihr mir helfen könntet! Ich bin nicht unbedingt ein HTML-Experte, mach das nur nebenbei ein wenig.

Vielen Dank im Voraus,

Felix