XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Anzeige im IE falsch (http://xhtmlforum.de/showthread.php?t=58169)

GoldieR 20.08.2009 11:51

Anzeige im IE falsch
 
Hallo
Ich habe mich an das Gerüst meiner Homepage gemacht.
hier der code:
Code:

#logo {
  background-color: #FEC641;
  padding: 0;
  height: 100px;
  margin: 10px;
  width: 100px;
  position: fixed; top: 15px;
  }

#header {
  background-color: #FEC641;
  padding: 0;
  height: 100px;
  margin: 10px 10px 10px 120px;
  }

#left {
  background: #FEC641;
  padding: 0;
  margin: 10px 10px
          10px -238px;
  width: 225px;
  position: absolute;
  top: -10px;
  left: 0;
  }

#main {
  background-color: #FEC641;
  padding: 0;
  margin: 10px 10px 10px 247px;
  position: relative;
  }

So soll es aussehen:
http://i30.tinypic.com/24wvzts.jpg
Dies funktioniert beim Firefox, bei Opera und bei Google Chrome.

Beim IE sieht es leider so aus:
http://i31.tinypic.com/15yzq7k.jpg

Kann mir jemand sagen, woran dies liegt?

Lg

Praktikant 20.08.2009 11:58

Ich denke mal, dass es daran liegt, dass du position:fixed; und sogar position:absolute; benutzt. Baue lieber auf float's um :)

GoldieR 20.08.2009 11:59

okay danke. dann werd ich das mal probieren.

GoldieR 20.08.2009 13:47

Ich habe nochmals eine kleine Frage:
Und zwar habe ich jetzt das mit dem float probiert.
So sieht der code jetzt aus:
Code:

#logo {
  background-color: #FEC641;
  color:black;
  padding: 0;
  height: 100px;
  margin: 10px;
  width: 150px;
  float: left;
  }

#header {
  background-color: #FEC641;
  color:black;
  padding: 0;
  height: 100px;
  margin: 10px;
  float:left;
  }

#left {
  background: #FEC641;
  color:black;
  padding: 0;
  margin: 10px;
  width: 150px;
  float: left;
  clear: left;
  }

#main {
  background-color: #FEC641;
  color:black;
  padding: 0;
  margin: 10px;
  float: left;
  }

Nur schiebt es mir das main jetzt immer nach oben neben den header. Auch möchte ich, dass der Header und das Main den Rest der Bildschirmbreite ausfüllen. Da ich aber Logo und left mit px definiert habe, weiss ich nicht genau, wie ich das machen soll.
Könnte mir bitte nochmals jemand helfen?

Praktikant 20.08.2009 13:54

Leider muss ich jetzt etwas raten.

Bei #main: float:left; raus, clear:both; rein, width:100%;
Bei #header brauchst du dann denke ich keine Breitenangabe mehr.

Allerdings wird es sehr schwer leserlich, wenn du einen Text hast, der bei einem 22" Monitor über die vollen 1050 Pixel Breite geht ;) Dann hat dein Text irgendwann plötzlich noch 2 Zeilen, und die Seite wirkt ziemlich leer :)

GoldieR 20.08.2009 13:57

danke, aber wenn ich dies so mache, kommt das main unter das left, was ich ja auch nicht möchte.
würdest du dann einfach eine feste px breite definieren?

Praktikant 20.08.2009 13:59

Geb mir doch mal nen Link zu deiner Seite, deinem Problem, deinem Testcase, dasnn geht das alles viel einfacher ;)

GoldieR 20.08.2009 14:03

Ich habe die Seite jetzt mal hochgeladen.
Du findest sie hier: Hundebänder

Wenn du sonst noch etwas brauchst, stelle ich es auch gerne online.

Praktikant 20.08.2009 14:26

Ich habe dich vorhin falsch verstanden gehabt, sorry.

#main braucht doch ein float:left; und kein clear.
Dann sollten beide Elemente nebeneinander rutschen. Vorsicht aber: du musst nach #main noch einmal clearen!
Die Breite bei #main lässt du auch am besten weg, dann ist es immer so Breit, wie es Platz braucht. Du kannst aber auch #left und #main jeweils eine Breite in % geben, genauso auch bei #logo und #header.

GoldieR 20.08.2009 14:29

danke, was meinst du mit:
Zitat:

Vorsicht aber: du musst nach #main noch einmal clearen!
Was muss ich da wo hin machen? Jetzt ist nämlich das main wieder nach oben gerutscht.


Alle Zeitangaben in WEZ +2. Es ist jetzt 18:11 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2020, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2020