IE 6 macht faxen, Darstellungsprobleme

Identität · 30. September 2006

Hallo Leute,
ich arbeite seit einigen Tagen nun endlich nicht mehr mit Tabellen

Aber es stellt sich ein Problem raus. Vorhin baute ich meine Seite um, benutze also <div>'s.

Im Firefox wird alles richtig angezeigt, im IE 6 bekam ich jedoch einen Schock.
Ich habe die Bilder angehängt. Im FF ist alles richtig, der IE jedoch nicht.

Den Code gebe ich natürlich auch.

Die HTML Seite:

HTML:

<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<link rel="stylesheet" type="text/css" href="files/style.css">
</head>
<body>
<div class="box1"><img src="files/header.gif" alt="header"></img></div>
<div class="box2"><img valign="bottom" src="files/navicell.jpg" alt="grafik"></img></div>
<div class="box3">
    <table cellspacing="0" cellpadding="0" border="0">
    <tr><td><a class="navi" href="http://www.bbv-luebeck.de">&nbsp;Home&nbsp;</a></td>
    </tr>
    <tr><td><a class="navi" href="seiten/aktuell.php">&nbsp;Aktuell&nbsp;</a></td>
    </tr>
    <tr><td><a class="navi" href="seiten/hauskatalog.php">&nbsp;Hauskatalog&nbsp;</a></td>
    </tr>
    <tr>
    <td><a class="navi" href="seiten/leistungen.php">&nbsp;Leistungen&nbsp;</a></td>
    </tr>
    <tr><td><a class="navi" href="seiten/referenzen.php">&nbsp;Referenzen&nbsp;</a></td>

    </tr>
    <tr><td><a class="navi" href="seiten/wir.php">&nbsp;Über uns&nbsp;</a></td>
    </tr>
    <tr><td><a class="navi" href="seiten/gzw.php">&nbsp;Gut zu Wissen&nbsp;</a></td>
    </tr>
    <tr><td><a class="navi" href="seiten/kontakt.php">&nbsp;Kontakt&nbsp;</a></td>
    </tr>
    <tr><td><a class="navi" href="seiten/impressum.php">&nbsp;Impressum&nbsp;</a></td>
    </tr>
    <tr><td><a class="navi" href="seiten/links.php">&nbsp;Links&nbsp;</a></td>
    </tr>
    </table>
</div>
<div class="box4">3</div>
</body>
</html>

Die CSS Datei:

HTML:

.box1{
width:800px;
border:1px solid #000;}

.box2{
border-right:1px solid #000;
border-left:1px solid #000;
border-bottom:1px solid #000;
width:35px;
float:left;}

.box3{
background-color:#FBF7F8;
border-right:1px solid #000;
border-bottom:1px solid #000;
width:129px;
float:left;
min-height:468px;}

.box4{
border-right:1px solid #000;
border-bottom:1px solid #000;
width:802px;
min-height:468px;}

/* Zusammen fassen // Grundformat */
A.navi:link,A.navi:visited,A.navi:hover
{
display:block;
line-height: 16px;
font-size:15px;
font-weight:bold;
font-family:Arial;
width: 129px;
text-decoration:none;
text-align:left;
border-top:#FAF7F7 1px solid;
border-bottom:1px solid #FAF7F7;}


/* color soll bei link und visited #000 sein alles andere wie oben */
A.navi:link,A.navi:visited
{
color:#000;}


/* color soll sich bei drüber ändern und der border der text soll nun rechts sein */
A.navi:hover
{
color: #fff;
background-color: #ff0000;
border-top:#000 1px solid;
border-bottom:#000 1px solid;
text-align:right;}

Danke an die, die mir versuchen zu helfen.
Gruß

Maik · 1. Oktober 2006

Mit diesem Modell macht der IE 6.0 bei mir keine Faxen

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">

<style type="text/css">
<!--
.wrapper {
width: 968px;
border: 1px solid #000;
}

.box1{
border-bottom: 1px solid #000;
}

.box2{
border-right: 1px solid #000;
width: 33px;
min-height: 468px;
height: 468px;
float: left;
margin-right: 0 !important; /* Für nicht-IE-Browser */
margin-right: -3px; /* Für IE */
}

.box3{
background-color: #FBF7F8;
border-right: 1px solid #000;
min-height: 468px;
height: 468px;
margin: 0 802px 0 34px !important; /* Für nicht-IE-Browser */
margin: 0 799px 0 31px; /* Für IE */
}

.box4{
float: right;
width: 802px;
min-height: 468px;
height: 468px;
margin-left: 0 !important; /* Für nicht-IE-Browser */
margin-left: -3px; /* Für IE */
}

.clear { /* stellt nach den floatenden Boxen den normalen Textfluss her */
clear: both;
height: 0;
line-height: 0;
font-size: 1px;
}

ul#navi {
margin: 0;
padding: 0;
list-style-type: none;
}

/* Zusammen fassen // Grundformat */
A.navi:link,A.navi:visited,A.navi:hover
{
display:block;
line-height: 16px;
font-size:15px;
font-weight:bold;
font-family:Arial;
width: 100%;
text-decoration:none;
text-align:left;
border-top:#FAF7F7 1px solid;
border-bottom:1px solid #FAF7F7;
margin: 0;}


/* color soll bei link und visited #000 sein alles andere wie oben */
A.navi:link,A.navi:visited
{
color:#000;}


/* color soll sich bei drüber ändern und der border der text soll nun rechts sein */
A.navi:hover
{
color: #fff;
background-color: #ff0000;
border-top:#000 1px solid;
border-bottom:#000 1px solid;
text-align:right;}
-->
</style>
</head>
<body>

<div class="wrapper">
     <div class="box1">1</div>
     <div class="box2">2</div>
     <div class="box4">4</div>
     <div class="box3">
          <ul id="navi">
              <li><a class="navi" href="http://www.bbv-luebeck.de">&nbsp;Home&nbsp;</a></li>
              <li><a class="navi" href="seiten/aktuell.php">&nbsp;Aktuell&nbsp;</a></li>
              <li><a class="navi" href="seiten/hauskatalog.php">&nbsp;Hauskatalog&nbsp;</a></li>
              <li><a class="navi" href="seiten/leistungen.php">&nbsp;Leistungen&nbsp;</a></li>
              <li><a class="navi" href="seiten/referenzen.php">&nbsp;Referenzen&nbsp;</a></li>
              <li><a class="navi" href="seiten/wir.php">&nbsp;Über uns&nbsp;</a></li>
              <li><a class="navi" href="seiten/gzw.php">&nbsp;Gut zu Wissen&nbsp;</a></li>
              <li><a class="navi" href="seiten/kontakt.php">&nbsp;Kontakt&nbsp;</a></li>
              <li><a class="navi" href="seiten/impressum.php">&nbsp;Impressum&nbsp;</a></li>
              <li><a class="navi" href="seiten/links.php">&nbsp;Links&nbsp;</a></li>
          </ul>
     </div>
     <div class="clear">&nbsp;</div>
</div>

</body>
</html>

IE 6 macht faxen, Darstellungsprobleme

Identität

Erfahrenes Mitglied

Anhänge

Maik

Neue Beiträge