Firefox vs Ie div container

[DRO] Rip · 22. August 2008

Hi Freunde,
ich habe folgendes Problem. Mein Freund und ich haben uns mit joomla eine Website erstellt, die bisher gar nicht so schlehct aussieht, und alles sitzt, wo es sein muss (im Firefox)...
Jetzt hab ich einmal ausversehen mit dem Internet-Explorer die Seite aufgerufen und siehe da, rechts auf der Seite ist beinahe alles nach unten gerutscht...

Die Seite:
http://testbereich.dro-online.de/jml2/

Hier einmal der Quellcode:

HTML:

<style type="text/css">
<!--
* {
  padding: 0;
  margin: 0;
}
body {
  font-family: tahoma, verdana, arial;
  font-size: 0.9em;
  background: url(http://testbereich.dro-online.de/jml2/templates/dro_template/images/header.gif) repeat-x;
width:100%;
height:100%;
}

#container {
  width: 1000px;
  margin-left: auto;
  margin-right: auto;
}

#sample {
  width: 160px;
  height: auto;

  font-family: tahoma, verdana, arial;
  font-size: 16px;
  text-align: left;
  text-decoration: none;
  color: #722A2B;
  float:left;
}

#logo_dro {
  background: url(http://testbereich.dro-online.de/jml2/templates/dro_template/images/logo.jpg) no-repeat;
  width: 191px;
  height: 116px;
  text-indent: –5000px;
 margin-left: 814px;
border-left: 2px solid #02b20f;
}

#header {
  width: 1000px;
  padding: 0em;
  margin-top: 0px;
  margin-left: auto;
  margin-right: auto;
background-color:#000;
}

#header_logo {
  background: url(http://testbereich.dro-online.de/jml2/templates/dro_template/images/header_loogo.jpg);
  width: 1000px;
  height: 116px;
  text-indent: –5000px;
float:left;
border-left:2px solid #000;
border-right:2px solid #000;
border-top:none;
border-bottom:none;
}

/*
#header2 {
  background: url(http://dro-online.de/jml/templates/dro_template/images/xxxxxx.jpg);
  margin-left: 814px;
  margin-top: –116px;
  width: 186px;
  height: 116px;
  text-indent: –5000px;
}
*/

#menu {
  padding-left: 5px;
padding-top:5px;
  padding-right: 5px;
  width: 146px;
  height: auto;
  background-color: #9bffa3;
  font-family: tahoma, verdana, arial;
  font-size: 18px;
letter-spacing:1px;
  text-align: left;
line-height:125%;
  text-decoration: none;
  color: #f00000;
  float:left;
border: solid 2px #02b20f;
border-top:none;
}

/*
#ornament {
  width: 116px;
  height: 115px;
  background-color: #9bffa3;
  background-position: bottom;
  text-indent: –5000px;
}*/

#content {
  width: 612px;
  margin-top: –506px;
  margin-left: 0px;
  padding-left: 27px;
  padding-top: 10px;
  padding-right: 15px;
  min-height: 700px;
  float: left;
  height: auto;
  background-color: #fff;
}


#foto {
  width: 186px;
  height: auto;
  background-color: #9bffa3;
 text-align:right;
  margin-left: 814px;
  text-indent: –5000px;
border: solid 2px #02b20f;
border-top:none;
border-bottom:none;
padding-top:10px;
line-height:115%;
}


#spacer_right {
  width: 186px;
  height: 30px;
  background-color: #9bffa3;
 text-align:right;
  margin-left: 814px;
  text-indent: –5000px;
border: solid 2px #02b20f;
border-top:none;
border-bottom:none;
}


#news {
  width: 186px;
  height: auto;
  background-color: #9bffa3;
 text-align:right;
  margin-left: 814px;
  text-indent: –5000px;
border: solid 2px #02b20f;
border-top:none;
padding-top:10px;
line-height:115%;
}


#extra {
  width: 176px;
  height: auto;
  background-color: #9bffa3;
  margin-left: 814px;
  text-indent: –5000px;
  padding-left: 10px;
  padding-top: 10px;
  font-family: tahoma, verdana, arial;
  font-size: 14px;
  text-align: left;
  text-decoration: none;
  color: #000;
line-height: 120%;
border: solid 2px #02b20f;
border-top:none;
}

#footer {
  width: 1000px;
  height: 44px;
  background-color: #9bffa3;
  padding-top: 16px; /* Abstand zur Hintergrundlinie */
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 0.7em;
  color: #C76100;
float:left;
border: solid 2px #02b20f;
}

#login {
letter-spacing:1px;
 padding-left: 5px;
padding-top:5px;
  padding-right: 5px;
  width: 146px;
  height: auto;
  background-color: #9bffa3;
  font-family: tahoma, verdana, arial;
  font-size: 18px;
  text-align: left;
  text-decoration: none;
  color: #000000;
  float:right;
border: solid 2px #02b20f;
}

#spacer_left {
padding-left: 5px;
  padding-right: 5px;
  width: 146px;
  height: 80px;
float:right;
}


-->
</style>

</head>

<body>
<div id="container">
  <div id="header">
    <h1 id="header_logo">
    </h1>
    <h1 id="header2">
    </h1>
  </div>
  
  
  
  <div id="contentarea">

<div id="sample">
    <div id="menu"><?php mosLoadModules ( 'left' ); ?>
    </div>

<div id="spacer_left"></div>

 <div id="login"><?php mosLoadModules ( 'inset' ); ?>
    </div>
</div>


    <div id="content">| <?php mosPathWay(); ?><br/><br/>
       <?php mosMainBody(); ?>
      <br/><br/>
    </div>

    
<div id="foto"><?php mosLoadModules ( 'top' ); ?></div>

<div id="spacer_right"></div>

<div id="news"><?php mosLoadModules ( 'newsflash' ); ?></div>

<div id="logo_dro"></div>

    <div id="extra"><?php mosLoadModules ( 'right' ); ?>
    </div>

  </div>

<div id="footer">
    <div align="center">Copyright by 
      <a href="<?php echo $mosConfig_live_site;?>"
         accesskey="1">
         <?php echo $mosConfig_sitename; ?>
      </a> ©2008 <br/>
    </div>
  </div>
</div>
</body>
</html>

Wie kann ich das Problem beheben???

Ich wäre für jede Hilfe dankbar!!!

lg Rip

Ps: habe schon in anderen Foren und per google gesucht, aber nichts zutreffendes finden können... -.-

ManOki · 22. August 2008

http://de.selfhtml.org/css/eigenschaften/positionierung.htm

damit solltest du dich mal beschäftigen ... ich glaub, keiner wird jetzt durchprobieren, bis es klappt.

Adagio · 22. August 2008

Nimm mal den XML Prolog raus aus dem Template (<?xml version="1.0"?>) ... dann müsste es im IE6 besser aussehen.

Der XML Prolog ist unnötig und bringt den IE6 in den Quirksmodus - darin interpretiert er das CSS Boxmodel falsch.

slowpoke · 22. August 2008

Hallo,
danke schonmal, funktioniert aber nicht.

PHP:

<?php echo "<?xml version=\"1.0\"?>"; ?>

Habe ich gelöscht, ändert aber nichts.

P.S.: Ich arbeite auch an der selben Seite.

Danke
Slowpoke

Adagio · 22. August 2008

Ok, aber eine Fehlerquelle wärs schonmal weniger

slowpoke · 22. August 2008

Problem gelöst, der div container "extra" hatte eine schmalere width, habe alle anderen widths, die auf der rechten Seite standen, daran angepasst, auch wenn es mit den breiteren hätte passen müssen.

#news {
width: 186px;
height: auto;
background-color: #9bffa3;
text-align:right;
.....
}

#extra {
width: 176px;
height: auto;
background-color: #9bffa3;
margin-left: 814px;
text-indent: –5000px;
....
}

Es dankt und grüßt
Slowi

[DRO] Rip · 22. August 2008

gut slowi!!

joa trotzdem danke an alle, die hier geantwortet haben!!!

MFG Rip

Suche

Firefox vs Ie div container

[DRO] Rip

Cadet 3rd Year

ManOki

Lt. Commander

Adagio

Gast

slowpoke

Ensign

Adagio

Gast

slowpoke

Ensign

[DRO] Rip

Cadet 3rd Year

Ähnliche Themen