Michael40221: Rand unter Bilden in Firefox & IE 6

SELF-Forum

Rand unter Bilden in Firefox & IE 6

Michael40221
– Informationen zu den Bewertungsregeln

Hallo zusammen,

ich habe ein Problem mit dem ich überhaupt nicht weiterkomme!

Ich habe eine verschachtelte Tabelle, die unter anderem eine Navspalte enthält. In dieser Spalte habe ich vier Bilder (als Links) mit CSS platziert.
Dazu habe ich die Bilder mit JAVA-Script mit einem Onmouseover-Effekt bearbeitet.

Ich habe um die Bilder einzeln noch ein Tabelle als Rahmen angelegt. Am unteren Rand der Bilder stellen Firefox und IE jetzt einen ca. 2 px großen leeren Raum dar. Safari und Opera machen es so wie es sein soll, nämlich als direkt anliegenden Rahmen.

Hier mal die notwendigen Quelltexte Stück für Stück: (nur für eines der vier Bilder)

  
<html xmlns="http://www.w3.org/1999/xhtml">  
  <head>  
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
   <title>Homepage</title>  
   <link href="main.css" rel="stylesheet" type="text/css">  
 <SCRIPT LANGUAGE="JavaScript">  
<!-- Begin  
loadImage1 = new Image();  
loadImage1.src = "bildmaterial/nav/profil.jpg";  
staticImage1 = new Image();  
staticImage1.src = "bildmaterial/nav/profil_g.jpg";  
// End -->  
  </script>  
 </head>  
 <body bgcolor="#666666">  
  <div style="max-width:1000px"><!--[if IE]><table><tr><td style="width: 1000px"><![endif]-->  
   <table width="90%"  border="0" cellspacing="0" cellpadding="0" bgcolor="#c8c8c8" style="margin-left:auto; margin-right:auto; margin-top:20px; height:500px">  
    <tr>  
<!---top-->  
     <td colspan="3" height="*" style="max-width:300px">&nbsp;</td>  
    </tr>  
    <tr height="90%">  
<!---left-->  
     <td width="*">&nbsp;</td>  
      <td width="95%">  
       <table width="100%" height="100%" border="1" cellspacing="0" cellpadding="0">  
        <td width="220px">  
  <div id="profil">  
   <table style="border: 2px solid #4C4C4C" cellspacing="0" cellpadding="0" >  
    <tr>  
     <td>  
      <a  href="profil.htm" onmouseover="image1.src=loadImage1.src;" onmouseout="image1.src=staticImage1.src;">  
       <img class="nav" name="image1" src="bildmaterial/nav/profil_g.jpg" border="0">  
     </a>  
           </td>  
   </tr>  
         </table>  
 </div>  
  
      </td>  
      <td>  
 content  
      </td>  
     </table>  
    </td>  
<!---right--->  
    <td width="*">&nbsp;</td>  
   </tr>  
   <tr>  
<!---bottom--->  
    <td colspan="3" height="*">&nbsp;</td>  
   </tr>  
  </table>  
  <!--[if IE]></td></tr></table><![endif]--></div></body>  
 </html>

dazu noch die CSS Inhalte:

  
#profil{  
  position:relative;  
  top:-80px;  
  left:10px;  
}

Ich hoffe, dass das ganze nicht zu unübersichtlich ist! Für Hilfe wäre ich außerordentlich dankbar!

Michael

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Rand unter Bilden in Firefox & IE 6

    Gunnar Bittersmann Homepage des Autors
    – Informationen zu den Bewertungsregeln

    @@Michael40221:

    ich habe ein Problem mit dem ich überhaupt nicht weiterkomme!
    Ich habe eine verschachtelte Tabelle,

    Das Problem behebst du, indem du alle 'table'-Elemente, in denen keine tabellarische Daten stehen, eliminierst und <http://de.selfhtml.org/css/layouts/index.htm@title=CSS-basiert layoutest>.

    Am unteren Rand der Bilder stellen Firefox und IE jetzt einen ca. 2 px großen leeren Raum dar.

    „Unterlänge“ ist dein Suchbegriff.

    <html xmlns="http://www.w3.org/1999/xhtml">

    Aha, XHTML. Wo ist die http://de.selfhtml.org/html/allgemein/grundgeruest.htm#dokumenttyp@title=DOCTYPE-Angabe? Informiere dich über „Quirks-Modus“!

    <SCRIPT LANGUAGE="JavaScript">

    Äh, wie jetzt, doch kein XHTML? Informiere dich über die http://de.selfhtml.org/html/xhtml/unterschiede.htm@title=Unterschiede!

    Und über die richtige <http://de.selfhtml.org/javascript/intro.htm#javascriptbereiche@title=Einbindung von JavaScript> (nicht „JAVA-Script“!) in HTML.

    <!-- Begin
    --8<--
    // End -->

    Auf die HTML-Kommentare im 'script'-Bereich verzichtest du besser.

    Und hinter "<!--" noch etwas zu schreiben, finde ich bedenklich.

    Live long and prosper,
    Gunnar

    --
    Das einzige Mittel, den Irrtum zu vermeiden, ist die Unwissenheit. (Jean-Jacques Rousseau)
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln