✔ Div wird im IE falsch ausgerichtet

Status
Nicht offen für weitere Antworten.
S

Spechter

Mitglied
Hallo,
ich arbeite gerade an folgender Seite: http://gothic.live-scripts.de/index.php
Jetzt ist mir beim testen mit dem IE aufgefallen, dass der mittlere Bereich falsch angezeigt wird, und zwar sollte der Inhalt ganz oben stehen. Firefox zeigt die Seite ohne Probleme an...
Jetzt weiß ich nicht an was es liegt.
Hier ein Auszug aus meiner CSS-Datei:
HTML: 
.left{
  float:			left;
  width:			200px;
  text-align:		left;
}

.right{
 float:			right;
 width:			200px;
}

.main{
 width:			599px;
 float:			left;
 text-align:		left;
 vertical-align:		top;
 margin-top:		0px;
}

.mid{
  text-align:		center;
  width:			999px;
  margin:		0 auto 0 auto;
  padding:		0px;
  background-image:      url(../pics/mitte.gif);
  text-align:		center;
  vertical-align:	top;
}

ich hoffe ihr könnt mir weiterhelfen

mfg Spechter
 
Hi,

hier mein Lösungsvorschlag:

Code: 
.head{
  font-size:                 12pt;
  margin-left:                 10px;
  padding:                 25px 0 0 120px;
  margin:                 0;
  background-image:         url(../pics/news.gif);
  width:                        470px;
  height:                68px;
  background-repeat:        no-repeat;
  background-position: 50px 0;
}

.left{
  float:                        left;
  width:                        200px;
  text-align:                left;
  margin-right: 0 !important;
  margin-right: -3px;
}

.right{
 float:                        right;
 width:                        200px;
 margin-left: 0 !important;
 margin-left: -3px;
}

.main{
 margin: 0 200px !important;
 margin: 0 197px;
 text-align:                left;
}

.main p {
padding: 0 50px;
}
Code: 
<!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">
<title>Gothic 3 Guide</title>
<meta name="author" content="Gothic3-Guide.de">
<meta name="generator" content="Ulli Meybohms HTML EDITOR">
<link rel="stylesheet" media="all" type="text/css" href="css/general.css" />

</head>
<body>
<div class="logo">
<img src="pics/header.gif" width="972" height="238" border="0" alt="">
</div>
<br />
<br />

<div class="mid">
  <div class="left">

  <img src="pics/1_links.gif" width="200" height="113" border="0" alt="">
  <img src="pics/menu.gif" width="200" height="30" border="0" alt=""> <br />

        <ul>
            <li><a href='index.php?page=quests&kat=main'>Hauptquests</a></li>
            <li><a href='index.php?page=quests&kat=myrtana'>Myrtana</a></li>
            <li><a href='index.php?page=quests&kat=nordmar'>Nordmar</a></li>
            <li><a href='index.php?page=quests&kat=varant'>Varant</a></li>
            <li><a href='index.php?page=quests&kat=other'>Sonstige Quests</a></li>
        </ul><br />
        <ul>
            <li><a href='index.php?page=map'>Karte</a></li>
            <li><a href='index.php?page=kontakt'>Kontakt</a></li>
        </ul>
        <br />
  <img src="pics/suche.gif" width="200" height="30" border="0" alt="">
  </div>


  <div class="right">
  <img src="pics/1_rechts.gif" width="200" height="113" border="0" alt="">
  <img src="pics/language.gif" width="200" height="30" border="0" alt="">
  <a href='select_lang.php?lang=ger'><img src="pics/germany.gif" width="30" height="18" border="0" alt=""></a>
  &nbsp;&nbsp;
  <a href='select_lang.php?lang=eng'><img src="pics/usa.gif" width="30" height="18" border="0" alt=""></a>

  <br />
  <img src="pics/shoutbox.gif" width="200" height="30" border="0" alt=""> <br />
  Coming soon...  <br />  <br />

  </div>

  <div class="main">
  <img src="pics/1_mitte.gif" width="599" height="113" border="0" alt=""> <br />

   <h1 class='head'>Page im Aufbau</h1>
<p>Willkommen auf der Gothic3-Guide - Seite. Diese Seite befindet sich zur Zeit noch im Aufbau!</p>

<div class='author'>
<p>erstellt von Spechter um 18.12.2006 14:13></p>
</div>
  </div>

  <div style="clear:both;font-size:1px;">&nbsp;</div>

</div>

</body>
</html>
 
danke für deine antwort. sie ging auch. hab jetzt aber mal geschaut an was es genau lag und ich hab den fehler jetzt auch selber gefunden:
HTML: 
   <div style="padding-left: 50px; padding-right: 50px;">
die 50px werden wohl von IE anderst interpretiert wie von Firefox.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück