nicht angemeldet
float:left-Problem im IE
Hallo,
wenn man sich die Seite http://www.uni-muenster.de/Physik/AP/Purwins/WelcomeDiv.html ansieht, stellt man fest, dass im IE6 der untere Bereich ca 3 Pixel nach rechts verschoben ist. Im MOZ und im Opera sieht es so aus, wie gewünscht.
Ich habe das Problem mal auf das Wesentliche reduziert:
...
<style type="text/css">
html, body { margin:0px;padding:0px }
#FussLinie {
width:100%;clear:left;height:10px;margin-left:190px;margin-right:0px;border:1px solid black;
}
#Fuss_links {
width:190px;float:left;height:50px;border:1px solid black;
}
#Fuss_mitte {
margin-left:190px;height:50px;border:1px solid black;
}
#Fuss_mitte2 {
margin-left:190px;border:1px solid black;
}
</style>
</head>
<body>
<div id="FussLinie">Linie</div>
<div id="Fuss_links">links</div>
<div id="Fuss_mitte">mittle/rechts</div>
<div id="FussLinie">Linie</div>
<div id="Fuss_links">links</div>
<div id="Fuss_mitte2">mitte/rechts</div>
...
siehe auch http://www.uni-muenster.de/Physik/AP/Purwins/Test2.html
Mit dieser Konstruktion möchte ich zwei Divs bündig nebeneinanderlegen. Das klappt aber nur, wenn man wie im unteren Fall die Höhenangabe weglässt.
Liegt hier ein IE-Bug vor oder habe ich da was falsch verstanden? Denn mit der Positionierung von Divs stehe ich noch auf Kriegsfuß.
Wenn es am IE liegt, gibt es einen Workaround?
Und noch eine Bitte an Besucher mit MACs oder mit IE 5 /5.5 (oder anderen Browsern): Könntet Ihr euch die Seite mal ansehen und hier schreiben, ob es mit diesen Browsern auch aussieht?
Gruß, Jürgen
-
Hi,
<div id="FussLinie">Linie</div>
<div id="Fuss_links">links</div>
<div id="Fuss_mitte">mittle/rechts</div>
<div id="FussLinie">Linie</div>
<div id="Fuss_links">links</div>Dir ist klar, daß eine ID nur einmalig verwendet werden kann?
siehe auch http://www.uni-muenster.de/Physik/AP/Purwins/Test2.html
Dieses Beispiel zeigt nicht wirklich ein Problem deutlich auf. Zudem wird es im Mozilla wohl kaum wie gewünscht angezeigt.
Aber zu Deiner Seite mit dem Ursprungsproblem. Ich finde, daß Du hier
- zuviel absolute Positionierung und
- viel zuviele DIVs verwendest.
Ich würde die Seite nochmal ganz neu aufbauen. Zunächst nur die logische Struktur festlegen (H1, H2, p usw.) und dann erst um zusammenzufassende Elemente ein DIV setzen.
Dies sollte dann auch vernünftig über CSS zu formatieren sein. Und sogar ohne absolute Positionierung.freundliche Grüße
Ingo-
Hallo Ingo,
Dir ist klar, daß eine ID nur einmalig verwendet werden kann?
Ja. Ich habe beim Basteln an der Testseite nur nicht aufgepasst. Aber auch mit Klassen wird die Sache nicht besser:
http://www.uni-muenster.de/Physik/AP/Purwins/Test2.htmlsiehe auch http://www.uni-muenster.de/Physik/AP/Purwins/Test2.html
Dieses Beispiel zeigt nicht wirklich ein Problem deutlich auf. Zudem wird es im Mozilla wohl kaum wie gewünscht angezeigt.Doch, wird es. Im IE aber nicht.
Aber zu Deiner Seite mit dem Ursprungsproblem. Ich finde, daß Du hier
- zuviel absolute Positionierung und
- viel zuviele DIVs verwendest.
Ich würde die Seite nochmal ganz neu aufbauen. Zunächst nur die logische Struktur festlegen (H1, H2, p usw.) und dann erst um zusammenzufassende Elemente ein DIV setzen.
Dies sollte dann auch vernünftig über CSS zu formatieren sein. Und sogar ohne absolute Positionierung.Leider klappt das noch nicht einmal in allen Browsern bei diesen einfachen Beispiel.
Das ist leichter gesagt, als getan. Besonders die Hintergrundfarben und die Rahmen haben ziemliche Probleme gemacht. Das Layout ist vom Rektorat vorgegeben und es ist mit geschachteteln Tabellen realisiert. Mein Ehrgeiz besteht nur darin, die Tabellen loszuwerden ohne das Layout zu verändern.
Gruß, Jürgen
-
Hallo,
ich glaube, ich habe das Problem dadurch lösen können, dass ich dem rechten Div keine, dafür aber dem Element im Div eine Höhe gegeben habe.
Es wäre nach wie vor schön, wenn MAC-User sich die Seite mal ansehen könnten.
Gruß, Jürgen
-
Hi,
ich glaube, ich habe das Problem dadurch lösen können, dass ich dem rechten Div keine, dafür aber dem Element im Div eine Höhe gegeben habe.
dieses eine ja - aber nicht die Probleme, die die absoluten Positionierungen bei Schriftvergrößerung mit sich bringen.
Übrigens wäre eine zum Hintergrund passend definierte Schriftfarbe nicht schlecht.freundliche Grüße
Ingo-
Hallo Ingo,
dieses eine ja - aber nicht die Probleme, die die absoluten Positionierungen bei Schriftvergrößerung mit sich bringen.
das ist im Moment kein Problem, da die Schriftgröße in px festgelegt ist. Das liegt daran, das alle Uni-Seiten gleich aussehen sollen und es beim Navigieren keine Sprünge im Layout geben soll. Daher auch noch die teilweise absolut positionierten Divs mit fester Breite. Eben ein Tabellenlayout.
Übrigens wäre eine zum Hintergrund passend definierte Schriftfarbe nicht schlecht.
Welche Farbe meinst Du?
Gruß, Jürgen
-
hi,
das ist im Moment kein Problem, da die Schriftgröße in px festgelegt ist.
das dies nur eine bestimmten browser vom ändern der schriftgrösse abhält, anderen jedoch vollkommen wurscht ist, ist dir bewusst?
gruss,
wahsaga-
Hallo,
ja, ist es. Und wenn man die Schriftgröße ändert, sieht es u.U. fürchterlich aus. Aber auf das Layout habe ich eben keinen Einfluss. Die Ursache für die feste Schriftgröße ist, glaube ich, der IE, der im gegensatz zu einigen anderen Browsern gerne mit Schriftgrad "kleiner" startet.
Gruß, Jürgen
-
Hi,
ja, ist es. Und wenn man die Schriftgröße ändert, sieht es u.U. fürchterlich aus.
was Du verhindern könntest, auch unter Beibehaltung des Layouts.
Die Ursache für die feste Schriftgröße ist, glaube ich, der IE, der im gegensatz zu einigen anderen Browsern gerne mit Schriftgrad "kleiner" startet.
Das kommt auf die Einstellung der Benutzer an. Tatsache ist, daß die Einstellung schonmal vergessen wird und man das erst dann merkt, wenn auf einer Webseite die Schriftgröße relativ angegeben ist. Wenn Du jetzt z.B. befürchtest, dies könnte öfter der Fall sein, ist Dir mit px natürlich geholfen. Nur das Problem bei der Schriftvergrößerung solltest Du dennoch lösen.
Und wie ich sagte natürlich eine Schriftfarbe angeben. Diese läßt sich sogar im IE beliebig einstellen und wenn Du schon falsche Einstellungen zum Schriftgrad befürchtest, solltest Du erst recht nicht von einer schwarz eingestellten Schriftfarbe ausgehen.freundliche Grüße
Ingo-
Hallo,
Und wie ich sagte natürlich eine Schriftfarbe angeben.
ich dachte, ich hätte für alle Bereich Schriftfarben angegeben. Wenn nicht, muss ich etwas übersehen haben. Wo fehlt denn die Schriftfarbe?
Gruß, Jürgen
-
hi,
ich dachte, ich hätte für alle Bereich Schriftfarben angegeben. Wenn nicht, muss ich etwas übersehen haben. Wo fehlt denn die Schriftfarbe?
lass mal dein CSS validieren, dabei bekommst du idR. für solche fälle warnungen angezeigt.
http://jigsaw.w3.org/css-validator/
gruss,
wahsaga-
Hallo,
leider nicht. Aber ich habe die Defaultfarbe verändert und so die Stelle gefunden. Danke an Dich und auch an Ingo.
Gruß, Jürgen
-
-
-
-
-
-
-
-