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

CSS Infobox in Internet Explorer

Status
Für weitere Antworten geschlossen.

Biolab

Neues Mitglied
Servus,

ich habe für eine Website mit CSS eine Infobox erstellt, funktioniert auch alles perfekt, allerdings nur in Firefox. Sobald ich die Site mit dem IE starte, stimmt die Position der Box und der Abstand zwischen den Vorschaubildern nicht mehr.

Wie kann man dieses Problem beheben?

Gruß
Biolab
 
Stimmt, hier ist auszugsweise der Quellcode

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>xxx</title>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8 ">
<link rel="stylesheet" type="text/css"
href="styles/layout.css">
<style type="text/css">
img {
border:none;
}
#box{
height:43px;
width:65px;
padding:0;
margin:8px;
font:bold 14px verdana, sans-serif;}
#box div{display:none;}
#box:hover div{
display:block;
width:310px;
position:absolute;top:845px;left:280px;
padding:15px;
font:normal 14px verdana, sans-serif;}
-->
</style>
</head>
<body>
<div id="Top">xxx
</div>
<div id="Navigation">
<ul id="NavList">
<li><a href="index.htm">Start</a></li>
<li><a href="aboutus.htm">&Uuml;ber uns</a></li>
<li><a href="overview.htm">Unsere H&auml;user</a></li>
<li><a href="booking.php">Buchungen</a></li>
<li><a href="contact.htm">Kontakt</a></li>
<li><a href="impressum.htm">Impressum</a></li>
</ul>
</div>
............

hier der Inhalt der Infobox:

</p>
<table>
<tbody>
<tr>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/thumbnail.jpg" alt="bild" height="60"
width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Vordera.jpg"
alt="Vorderansicht1" height="307" width="410"></p>
</div>
</div>
</td>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Vordera2.jpg" alt="Vorderansicht2"
height="60" width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Vordera2.jpg"
alt="" height="307" width="410"></p>
</div>
</div>
</td>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Hintera.jpg" alt="Vorderansicht2"
height="60" width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Hintera.jpg"
alt="" height="307" width="410"></p>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Draufsicht.jpg" alt="Draufsicht"
height="60" width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Draufsicht.jpg"
alt="Draufsicht" height="307" width="410"></p>
</div>
</div>
</td>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Balkon.jpg" alt="Balkon"
height="60" width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Balkon.jpg"
alt="Balkon" height="307" width="410"></p>
</div>
</div>
</td>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Aussicht.jpg" alt="Aussicht"
height="60" width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Aussicht.jpg"
alt="Aussicht" height="307" width="410"></p>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Wohnzimmer.jpg" alt="Wohnzimmer"
height="60" width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Wohnzimmer.jpg"
alt="Wohnzimmer" height="307" width="410"></p>
</div>
</div>
</td>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Schlafzimmer.jpg" alt="Schlafzimmer"
height="60" width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Schlafzimmer.jpg"
alt="Schlafzimmer1" height="307" width="410"></p>
</div>
</div>
</td>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Schlafzimmer2.jpg" alt="Schlafzimmer2"
height="60" width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Schlafzimmer2.jpg"
alt="Schlafzimmer2" height="307" width="410"></p>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Kueche.jpg" alt="Kueche"
height="60" width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Kueche.jpg"
alt="Kueche" height="307" width="410"></p>
</div>
</div>
</td>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Esszimmer.jpg" alt="Esszimmer"
height="60" width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Esszimmer.jpg"
alt="Esszimmer" height="307" width="410"></p>
</div>
</div>
</td>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Flur.jpg" alt="Flur" height="60"
width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Flur.jpg"
alt="Flur" height="307" width="410"></p>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Bad1.jpg" alt="Bad1" height="60"
width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Bad1.jpg"
alt="Bad1" height="307" width="410"></p>
</div>
</div>
</td>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Bad2.jpg" alt="Bad2" height="60"
width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Bad2.jpg"
alt="Bad2" height="307" width="410"></p>
</div>
</div>
</td>
<td>
<div id="box"><a href="#"><img
src="images/Haus1/Detail/Sauna.jpg" alt="Sauna"
height="60" width="90"></a>
<div>
<p><img src="images/Haus1/Detail/Sauna.jpg"
alt="Sauna" height="307" width="410"></p>
</div>
</div>
</td>
</tr>
</tbody>
</table>
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben