Tabelle wird im IE versetzt angezeigt

Status
Nicht offen für weitere Antworten.
C

counteract

Erfahrenes Mitglied
Hallo!

Ich habe ein Problem mit dem IE! Und zwar habe ich auf meiner Seite einen Banner angelegt, der aus mehreren Bildern besteht und mit Tabellen zusammengefügt ist. In meinen HTML Editor habe ich festgelegt, dass die Seite keine Ränder hat. (also oben nicht und links nicht)

Dies wird im Firefox auch richtig angezeigt. wie kann man dies auch für den IE erreichen?

MfG

Counteract
 
M

Maik

Ohne den Quelltext gesehen zu haben, vermute ich jetzt mal, daß Du im HTML-Code zwischen <td> ... </td> und dem img-Element Leerzeichen oder Zeilenumbrüche notiert hast, die der IE mit Lücken bzw. Verschiebungen im Layout quittiert.

Wenn dem so ist, dann wende die CSS-Eigenschaft display:block auf die Grafiken an.

Wenn nicht, dann zeig bitte den Quelltext, denn hellsehen können wir hier nicht.
 
C

counteract

Erfahrenes Mitglied
Warte ich zeig euch den quelltext:

HTML: 
<html>

<head>
<style type="text/css"> 
<!--
body { 
background: url(banner_6-Hintergrund.jpg) repeat-x 0 0; 
} 

#anmeldeleiste { /* Für nicht-IE-Browser */ 
position: fixed; 
left:0; 
right: 0; 
bottom: 0; 
z-index: 7; 
height: 20px; 
background: #000; 
border-top: 3px solid silver; 
} 
--> 
</style> 
<!--[if lt IE7]>
<style type="text/css">
#anmeldeleiste { /* Für IE */ 
position: absolute; 
bottom:0; 
top: expression(document.body.scrollTop + document.body.clientHeight - this.clientHeight); 
width: 100%; 
width:expression(document.body.clientWidth);
 } 
</style> 
<![endif]--> 

</head>
<title></title>
<meta name="" content="">

<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red" leftmargin="0" marginwidth="0" topmargin="0" marginheight="0">
<table border="0" width="1000" cellspacing="0" cellpadding="0">
    <tr>
        <td width="1000"><img src="http://www.tutorials.de/forum/images/CTban_0.jpg" width="1000" height="112" border="0"></td>
    </tr>
    <tr>
        <td width="1000">
            <table border="0" width="1000" cellspacing="0" cellpadding="0">
                <tr>
                    <td width="49"><a href="index.php" target="_self"><img src="http://www.tutorials.de/forum/images/CTban_C1R2_0.jpg" width="49" height="28" border="0"></a></td>
                    <td width="67"><a href="branchen.htm" target="_self"><img src="http://www.tutorials.de/forum/images/CTban_C1R2_1.jpg" width="67" height="28" border="0"></a></td>
                    <td width="65"><a href="leistung.htm" target="_self"><img src="http://www.tutorials.de/forum/images/CTban_C1R2_2.jpg" width="65" height="28" border="0"></a></td>
                    <td width="55"><a href="kunden.htm" target="_self"><img src="http://www.tutorials.de/forum/images/CTban_C1R2_3.jpg" width="55" height="28" border="0"></a></td>
                    <td width="69"><a href="bewerber.htm" target="_self"><img src="http://www.tutorials.de/forum/images/CTban_C1R2_4.jpg" width="69" height="28" border="0"></a></td>
                    <td width="87"><a href="jobangebote.php" target="_self"><img src="http://www.tutorials.de/forum/images/CTban_C1R2_5.jpg" width="87" height="28" border="0"></a></td>
                    <td width="105"><a href="projektangebote.php" target="_self"><img src="http://www.tutorials.de/forum/images/CTban_C1R2_6.jpg" width="105" height="28" border="0"></a></td>
                    <td width="58"><a href="kontakt.htm" target="_self"><img src="http://www.tutorials.de/forum/images/CTban_C1R2_7.jpg" width="58" height="28" border="0"></a></td>
                    <td width="445"><img src="http://www.tutorials.de/forum/images/CTban_C1R2_8.jpg" width="445" height="28" border="0"></td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td width="1000"><img src="http://www.tutorials.de/forum/images/CTban_2.jpg" width="1000" height="30" border="0"></td>
    </tr>
</table>
<table width="826" cellspacing="0" style="border-collapse:collapse;" height="509">
    <tr>
        <td width="630" colspan="5" style="border-width:1; border-color:black; border-style:none;" height="241" rowspan="2">
            <h4 align="center"><img src="ctpic.JPG" width="341" height="187" border="0"></h4>
        </td>
        <td width="-1" rowspan="7" height="483" style="border-width:1; border-color:black; border-style:none;">
            <p align="left"><img src="line1.gif" width="1" height="495" border="0"></p>
        </td>
        <td width="187" height="222" style="border-width:1; border-color:black; border-style:none;">
            <div align="left">
                <form action="login.php" method="post">
                    <p><font size="2" face="Arial">Name</font></p>
                    <p><input type="text" name="name" maxlength="20"></p>
                    <p><font size="2" face="Arial">Passwort</font></p>
                    <p><input type="password" name="pwd" maxlength="20"></p>
                    <p><input type="submit" value="Login"></p>
                </form>
                <p>&nbsp;</p>
            </div>
        </td>
    </tr>
    <tr>
        <td width="187" height="10" style="border-width:1; border-color:black; border-style:none;">&nbsp;</td>
    </tr>
    <tr>
        <td width="630" height="5" colspan="5" style="border-width:1; border-color:black; border-style:none;">
            <p align="left"><img src="line4.gif" width="630" height="1" border="0"></p>
        </td>
        <td width="187" height="5" style="border-width:1; border-color:black; border-style:none;"><img src="line3.gif" width="180" height="1" border="0"></td>
    </tr>
    <tr>
        <td width="201" style="border-width:1; border-color:black; border-style:none;" height="29">
<b><font size="3" face="Arial" color="#999999">Bewerber</font></b><span style="background-color:rgb(204,204,204);">        </span></td>
        <td width="-2" rowspan="4" height="217" style="border-width:1; border-color:black; border-style:none;">
<img src="line2.gif" width="1" height="229" border="0">        </td>
        <td width="215" style="border-width:1; border-color:black; border-style:none;" height="29">
<b><font size="3" face="Arial" color="#999999">Branchen</font></b><span style="background-color:rgb(204,204,204);">        </span></td>
        <td width="1" rowspan="4" height="217" style="border-width:1; border-color:black; border-style:none;">
<img src="line2.gif" width="1" height="229" border="0">        </td>
        <td width="200" style="border-width:1; border-color:black; border-style:none;" height="29">
<b><font size="3" face="Arial" color="#999999">Leistung</font></b><span style="background-color:rgb(204,204,204);">        </span></td>
        <td width="187" height="29" style="border-width:1; border-color:black; border-style:none;">&nbsp;</td>
    </tr>
    <tr>
        <td width="201" height="95" style="border-width:1; border-color:black; border-style:none;">
            <p align="center"><img src="bmw4.jpg" width="160" height="50" border="0"></p>
        </td>
        <td width="215" height="95" style="border-width:1; border-color:black; border-style:none;">
            <p align="center"><img src="schlussel.jpg" width="160" height="50" border="0"></p>
        </td>
        <td width="200" height="95" style="border-width:1; border-color:black; border-style:none;">
            <p align="center"><img src="por4.jpg" width="160" height="50" border="0"></p>
        </td>
        <td width="187" height="95" style="border-width:1; border-color:black; border-style:none;">
            <p><?php  
if (isset ($_REQUEST["fehler"]))  
{  
  echo "Die Zugangsdaten waren ungültig.";  
}  
?> </p>
        </td>
    </tr>
    <tr>
        <td width="201" height="41" style="border-width:1; border-color:black; border-style:none;">
            <p><span style='font-family:
"MS Reference Sans Serif";font-size:8pt'>Text</span></p>
        </td>
        <td width="215" height="41" style="border-width:1; border-color:black; border-style:none;">
            <p><span style='font-family:
"MS Reference Sans Serif";font-size:8pt'>Text</span></p>
        </td>
        <td width="200" height="41" style="border-width:1; border-color:black; border-style:none;">
            <p><span style='font-family:
"MS Reference Sans Serif";font-size:8pt'>Text</span></p>
        </td>
        <td width="187" height="91" style="border-width:1; border-color:black; border-style:none;" rowspan="2">&nbsp;</td>
    </tr>
    <tr>
        <td width="201" height="6" style="border-width:1; border-color:black; border-style:none;">
<font size="2" face="Arial" color="#999999">mehr</font>        </td>
        <td width="215" height="6" style="border-width:1; border-color:black; border-style:none;">
<font size="2" face="Arial" color="#999999">mehr</font>        </td>
        <td width="200" height="6" style="border-width:1; border-color:black; border-style:none;">
<font size="2" face="Arial" color="#999999">mehr</font>        </td>
    </tr>
	
<div align="center">
<div id="anmeldeleiste"><font size="2" face="Arial" color="#CCCCCC">Text</font></div>

</body> 
</html>

Als weisteres Problem habe ich festgestellt, dass im IE nach den 3 Grauen Wörtern ein kleiner Grauer Balken ist! Wie kann man dieses Problem lösen?
 
Zuletzt bearbeitet:
M

Maik

  • Setze in dem Conditional Comment ein Leerzeichen zwischen IE und die Versionsnummer 7:
Code: 
<!--[if lt IE 7]>
  • Entferne nach den Wörtern das span-Element mit der grauen Hintergrundfarbe:
Code: 
<b><font size="3" face="Arial" color="#999999">Bewerber</font></b><span style="background-color:rgb(204,204,204);">        </span>
 
C

counteract

Erfahrenes Mitglied
Danke die beiden Probleme sind gelöst.

Ich hab nur noch ein Problem und zwar spinnt im IE die Scrolleiste, wenn man scrollt dann kann man bis ins unentliche scrollen. Ziemlich komisch! Hast du dazu noch ne idee?
 
M

Maik

Das liegt an der Rahmendefinition für das DIV #anmeldeleiste, wie ich eben herausgefunden habe.

Wenn ich die border-top-Eigenschaft aus dem Selektor rausnehme, lässt sich die Seite im IE ganz normal scrollen.
 
M

Maik

Ich habe es gestern Abend doch schon (in verständlichem deutsch) erläutert.

Die border-top-Eigenschaft muß aus dem CSS-Selektor #anmeldeleiste entfernt werden:

Code: 
#anmeldeleiste { 
position: fixed; 
left:0; 
right: 0; 
bottom: 0; 
z-index: 7; 
height: 20px; 
background: #000; 
/*border-top: 3px solid silver;*/ /* auskommentiert = deaktiviert */
}
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge