mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 28.03.2024 17:44 Benutzername: Passwort: Auto-Login

Thema: IE float problem? vom 06.12.2007


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> IE float problem?
Autor Nachricht
ject
Threadersteller

Dabei seit: 03.04.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Do 06.12.2007 21:39
Titel

IE float problem?

Antworten mit Zitat Zum Seitenanfang

Hi,

ich hab hier ein Problem, wo ich grad nicht durchblick...

Ich habe folgendes CSS-Grundgerüst, das in Firefox und Opera auch wie gewünscht dargestellt wird, nur
in IE ist das ganze weit nach unten langgezogen. Ich nehme an, es dürfte ein Problem mit dem float sein,
nur hab ich nicht rausgekriegt welches....


Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
<!--
body,td,th {
   font-family: Georgia, Times New Roman, Times, serif;
   font-size: 10px;
   color: #FFFFFF;
   margin:0;
}
body {
   background-color: #000000;
   background-image:url(../Back_grad.jpg);
   background-repeat:repeat-x;
}

#container {
   width:780px;
   height:750px;
   margin:auto;
}
#head {
   width:250px;
   height:250px;
}
#headR {
   width:530px;
   height:250px;
   float:right;   
}
#main {
   width:780px;
}
#mainL {
   width:250px;
   height:350px;
}
#mainR {
   width:530px;
   height:350px;
   float:right;
   overflow:auto;
}
#footer {
   width:780px;
   height:100px;
}
-->
</style></head>
<body>
<div id="container">
      <div id="headR">
      </div>
      <div id="head">
      </div>     
      <div id="main">
      <hr />
            <div id="mainR">
            </div>
            <div id="mainL">
           </div>   
      <hr />
      </div>
      <div id="foot">
      </div>
</div>

</body>
</html>


Weil ich grad dabei bin gleich noch eine Frage Lächel
Warum eigentlich muss das gefloatete Element im <body> vor dem nichtgefloateten stehen?
z.B "mainR"(rechts) vor "mainL"(links)
(Wenn ich es umgekehrt mache, rutscht "mainR" in Dreamweaver nach unten...)

Vielen Dank für Antworten,
ject
  View user's profile Private Nachricht senden
ject
Threadersteller

Dabei seit: 03.04.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst So 09.12.2007 16:07
Titel

Antworten mit Zitat Zum Seitenanfang

Kommt schon, hat niemand eine Ahnung?
  View user's profile Private Nachricht senden
Anzeige
Anzeige
foorious

Dabei seit: 15.10.2007
Ort: Frankfurt
Alter: -
Geschlecht: Männlich
Verfasst Mo 10.12.2007 10:05
Titel

Antworten mit Zitat Zum Seitenanfang

Hi,
hab mir mal die Zeit genommen, den Code ein bisschen umzuschreiben *zwinker*
Ein bisschen geordnet und ergänzt, damits vielleicht übersichtlicher ist.
Die Farben dienen nur zur Veranschaulichung.

Du hattest die falsche id im html-code beim footer stehen.
Und falls irgendwas nicht klar ist, fragen.

Hab das "float: left" auf alle Boxen angewendet, die nebeneinander stehen sollen.
Im Footer musste man "clear: both" verwenden, um den anzuzeigen.
Ich hab leider vergessen wofür das genau gebraucht wird, hat irgendwas mit dem float zu tun. *Huch*
Vielleicht erklärt sich manches auch von selbst. Bei mir klappts auf jeden Fall im IE und Firefox.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
<!--
body,td,th {
   font-family: Georgia, Times New Roman, Times, serif;
   font-size: 10px;
   color: #fff;
}

* {
   margin: 0;
   paddin: 0;
}

body {
   background-color: #fff;
}

#container {
   width: 780px;
   margin: 0 auto;
}

#head {
   width: 250px;
   height: 250px;
   float: left;
   background: #993300;
}

#headR {
   width: 530px;
   height: 250px;
   float: left;
   background: #CC00FF;
}

#main {
   width: 780px;
   height: 350px;
}

#mainR {
   width: 250px;
   height: 350px;
   float: left;
   background: #c0c0c0;
}

#mainL {
   width: 530px;
   height: 350px;
   float: left;
   background: #000;
}

#footer {
   width: 780px;
   height: 100px;
   clear: both;
   background: #ff6600;
}
-->
</style>
</head>
<body>
<div id="container">
      <div id="headR">
      </div>
      <div id="head">
      </div>     
      <div id="main">
            <div id="mainL">
            </div>
            <div id="mainR">
           </div>   
      </div>
      <div id="footer">
      </div>
</div>

</body>
</html>
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
ject
Threadersteller

Dabei seit: 03.04.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 10.12.2007 11:38
Titel

Antworten mit Zitat Zum Seitenanfang

Cool, funktioniert auch bei mir.
Danke!
  View user's profile Private Nachricht senden
 
Ähnliche Themen img ul float problem
Float-Problem?
float Problem
float problem
Problem mit Float
Div Float Left Problem
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.